How do I target elements within a class, without targeting elements in the same class used elsewhere? (jQuery)
<p>I've got a <code>floated</code> list of elements which I want the same <code>height</code> on. But there is more than one list per page, and they all use the same class-name. </p>

<p>How to I reset the <code>tallest</code> variable for each list so they don't all inherit the height from the tallest list-item on the page, but only from within it's own list?</p>

<p>Here's my HTML:</p>

<pre><code>&lt;ul class="thumbs"&gt;
   &lt;li class="thumb"&gt;
      &lt;img /&gt;
      &lt;p&gt;Some text&lt;/p&gt;
   &lt;/li&gt;
   &lt;li class="thumb"&gt;
      &lt;img /&gt;
      &lt;p&gt;Some text&lt;/p&gt;
   &lt;/li&gt;
&lt;/ul&gt;

&lt;!-- Same classnames, different content. Just an example, it's not 
     necessary with or without images                           --&gt;
&lt;ul class="thumbs"&gt;
   &lt;li class="thumb"&gt;
      &lt;p&gt;Some text&lt;/p&gt;
      &lt;p&gt;Some more text&lt;/p&gt;
   &lt;/li&gt;
   &lt;li class="thumb"&gt;
      &lt;p&gt;Some text&lt;/p&gt;
   &lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>Here's the jQuery <a href="http://www.cssnewbie.com/equalheights-jquery-plugin/" rel="nofollow">equalHeights plugin</a> I'm using:</p>

<pre><code>(function($) {
 $.fn.equalHeights = function(minHeight, maxHeight) {
  tallest = (minHeight) ? minHeight : 0;
  this.each(function() {
   if($(this).height() &gt; tallest) {
    tallest = $(this).height();
   }
  });
  if((maxHeight) &amp;&amp; tallest &gt; maxHeight) tallest = maxHeight;
  return this.each(function() {
   $(this).height(tallest).css("overflow","auto");
  });
 }
})(jQuery);
</code></pre>

<p>which I call with:</p>

<pre><code>$(function() {
   $('.thumb').equalHeights();
});
</code></pre>

<p>I also don't want to add new classes or id's to the markup.</p>

<p>Thanks.</p>

<p>Update - adding some examples of the different <code>&lt;li&gt;</code>'s I have. There are many, so not even sure if I've cought them all here:</p>

<pre><code>&lt;ul class="thumbs"&gt;
&lt;li class="thumb first"&gt;
 &lt;p class="boxHeading"&gt;Featured collection&lt;/p&gt;
 &lt;h3&gt;&lt;a class="boxFeatured" href="#"&gt;Dining chair &lt;span class="by"&gt;by bowline&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;
 &lt;div class="img"&gt;
  &lt;img src="media/dummy/diningChair.jpg" width="250" height="180" alt="Dining chair" /&gt;
 &lt;/div&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;ul class="thumbs"&gt;
&lt;li class="thumb"&gt;
 &lt;div class="img"&gt;
  &lt;img src="media/dummy/diningChair3.jpg" width="204" height="156" alt="DiningChair3" /&gt;
 &lt;/div&gt;
 &lt;h4 class="readMore"&gt;&lt;a class="readMore" href="link/that/biggerlink.js/follows"&gt;Product name&lt;/a&gt;&lt;/h4&gt;
 &lt;dl class="boxDescription"&gt;
  &lt;dt&gt;By:&lt;/dt&gt;
  &lt;dd&gt;&lt;a href="#"&gt;Vincent Shephard&lt;/a&gt;&lt;/dd&gt;
  &lt;dt&gt;Colour:&lt;/dt&gt;
  &lt;dd&gt;brown, white&lt;/dd&gt;
  &lt;dt&gt;Price:&lt;/dt&gt;
  &lt;dd&gt;$XXX.XX&lt;/dd&gt;
 &lt;/dl&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;ul class="thumbs"&gt;
&lt;li class="thumb"&gt;
 &lt;h3 class="boxHeading"&gt;&lt;a href="#"&gt;Featured collection&lt;/a&gt;&lt;/h3&gt;
 &lt;div class="img"&gt;
  &lt;img src="media/dummy/diningChair.jpg" width="232" height="180" alt="Dining chair" /&gt;
 &lt;/div&gt;
 &lt;p class="readMore"&gt;
  In one word, you reproach us with intending 
  to do away with your property.  Precisely so; 
  that is just what we intend.
 &lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;ul class="thumbs"&gt;
&lt;li class="thumb first"&gt;
 &lt;h3 class="boxHeading"&gt;&lt;a href="#"&gt;Tables (category)&lt;/a&gt;&lt;/h3&gt;
 &lt;div class="img"&gt;
  &lt;img src="media/dummy/diningChair.jpg" width="232" height="180" alt="Dining chair" /&gt;
 &lt;/div&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;ul class="thumbs"&gt;
&lt;li class="thumb first"&gt;
 &lt;h4 class="small"&gt;&lt;a class="small" href="test.html"&gt;Product name&lt;/a&gt;&lt;/h4&gt;
 &lt;div class="img"&gt;
  &lt;img src="media/dummy/diningChair.jpg" width="204" height="156" alt="Dining chair" /&gt;
 &lt;/div&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;ul class="thumbs"&gt;
&lt;li class="thumb dropShadow offwhite first center"&gt;
 &lt;div class="img"&gt;
  &lt;img src="media/dummy/recent1.jpg" width="134" height="180" alt="Advertisement1" /&gt;
 &lt;/div&gt;
 &lt;h4 class="small bold"&gt;&lt;a class="small bold"&gt;Inside Out&lt;/a&gt;&lt;/h4&gt;
 &lt;p&gt;July 2009&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>That <em>should</em> cover all of them, although I might have missed some. Thanks for your patience. </p>
