html - Length of a `p`, change `class` in parent `div` jQuery -


i trying adapt height of parent div depending on text length of child p.descr. applying class, in turn has different height in css. find below jquery code:

$(document).ready(function(){      $('p.descr').each(function(){          if($(this).text().length < 90){            $(this).parent().addclass('bigp90');          } if($(this).text().length [90,180]) {            $(this).parent().addclass('bigp180');          } if($(this).text().length [181,270]) {            $(this).parent().addclass('bigp270');          } if($(this).text().length [271,360]) {            $(this).parent().addclass('bigp360');          } if($(this).text().length > 360) {            $(this).parent().addclass('bigp450');          }    });  });

the problem class bigp90 , bigp450 applied , work fine, not ones in middle. means there wrong syntax can't figure out what. thanks.

length [90,180] doesn't test whether length between 90 , 180. square brackets accessing array elements or object properties, treats length array , tries access 180'th element of array.

there's no short syntax testing range in javascript. test if it's above lower limit , below upper limit, e.g.

if (val >= 90 && val < 180) 

but since you've tested lower limit previous if, can use else if test next upper limit, lower limit test redundant.

$(document).ready(function() {   $('p.descr').each(function() {     var len = $(this).text().length;     var parent = $(this).parent();     if (len < 90) {       parent.addclass('bigp90');     }     else if (len < 180) {       parent.addclass('bigp180');     }     else if (len < 270) {       parent.addclass('bigp270');     }     else if (len < 360) {       parent.addclass('bigp360');     }     else {       parent.addclass('bigp450');     }   }); }); 

Comments