Measure highest UL Tag with jQuery

Question

Hello,

Im trying to measure and grab the highest of ul tags.

Markup is very simple.

<ul class="ul_class">
   <li>One</li>
   <li>Two</li>
   <li>Three</li>
</ul>

<ul class="ul_class">
   <li>a</li>
   <li>b</li>
   <li>c</li>
   <li>d</li>  
   <li>e</li>
</ul>


<ul class="ul_class">
   <li>a1</li>
   <li>b1</li>
   <li>c1</li>
   <li>d1</li>  
   <li>e1</li>
   <li>f1</li>
</ul>

So im displaying ul as blocks. Obviously the highest will te the one that has the mosl li tags in it, but how can I get this height into variable?

Thank you for your help in advance

Answer 1

You can probably use the $('selector').height() on each one and find the tallest

http://docs.jquery.com/CSS/height

something like

var max = 0;
$('.ul_class').each(function(){
   var h = $(this).height();
   if(h > max)
        max = h;
});

// max is the max here.

Answer 2

I agree with John Boker that you will want to use height() rather than some method that counts the number of lis. The reason for this is that depending on the contents of the li, if it were a paragraph of text, it could have one li but be longer than a 2 li list with very short list items.

<ul>
  <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla laoreet lacinia augue, a dignissim orci sagittis nec. Fusce blandit commodo felis, et aliquam orci auctor id. Vestibulum sagittis felis non urna condimentum gravida. Duis quam erat, facilisis nec rutrum sed, hendrerit non leo. Nam varius nunc eget dolor dictum sagittis rutrum sem rhoncus.</li>
</ul>

• Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla laoreet lacinia augue, a dignissim orci sagittis nec. Fusce blandit commodo felis, et aliquam orci auctor id. Vestibulum sagittis felis non urna condimentum gravida. Duis quam erat, facilisis nec rutrum sed, hendrerit non leo. Nam varius nunc eget dolor dictum sagittis rutrum sem rhoncus.

<ul>
<li>Short</li>
<li>Short 2</li>
</ul>

• Short
• Short 2

Presuming that the ul is not floated or hidden, the method by John Boker will work. If that were the case, you would have to wait to hide or float them until their height has been measured.