JQuery height condition

Question

$(document).ready(function() {
var pic = $(".pic");

// need to remove these in of case img-element has set width and height
$(".pic").each(function() {
    var $this = $(this);
    $this.css({width: 'auto', height: 'auto'});

    var pic_real_width = $this.width();
    var pic_real_height = $this.height();
    if(pic_real_width<100){
    $(".pic").css("display","none");
    }
    });

 });

I need this to check for the height of all images of the .pic class (it already does this) and then add a display:none to those who have a certain size. (e.g. if an img has under 100px width it should not be displayed)

Answer 1

This should do the trick:

$(document).ready(function() {
    // need to remove these in of case img-element has set width and height
    $(".pic").each(function() {
     var $this = $(this);
     $this.css({width: 'auto', height: 'auto'});

     var pic_real_width = $this.width();
     var pic_real_height = $this.height();
     if(pic_real_width<100){
      $this.css("display","none");
     }
    });
 });

you ware again referencing the collection and not a concrete element