I have a Wordpress website where the posts contain images with the .aligncenter class. I want to style the images that are less than 400px in width by adding the display:inline-block; property and reducing their size to 40%.
Here is the approach I tried:
var size = jQuery(".aligncenter").width();
if(size < 400) {
jQuery(".aligncenter").css({
'display' : 'inline-block',
'width' : '40%'
});
}
However, this code ends up affecting all images in the post, including those that are larger than 400px. How can I target only images that are less than 400px?