title: How to properly filter divs by class using jQuery?
body: <p>I'm filtering an ASP.NET repeater that's outputting over 2000 divs on the client side using jQuery. The ItemTemplate of the repeater holds a div (runat="server"). In the repeater OnItemDataBound event, I have some logic to apply css classes according to the data. I then have some links with id's having the same name as the css classes so that when one clicks a link, the jQuery hides all divs outputted by the repeater that don't have a matching id/class combo. Also, there are some cases where there are more than one class applied to the divs.</p>
  
  <p>Everything works fine the first 2 or so times I click a link to filter the divs, but then it gets hung up, becoming unresponsive.</p>
  
  <p>The jQuery:</p>
  
  <pre><code>$(document).ready(function () {
      $('#filters a').click(function (e) {
          e.preventDefault();
          if ($(this).attr('id') == 'all') {
              $('#divIssueMenu').children().show();
          }
          else {
              var filter = $(this).attr('id');
              $('#divIssueMenu').children().show();
              $('#divIssueMenu').children().not('.' + filter).hide();
          }
      });
  });
  </code></pre>
  
  <p>And outputted markup:</p>
  
  <pre><code>&lt;div id='filters'&gt;
      &lt;a href='#' id="all" &gt;All&lt;/a&gt; | 
      &lt;a href='#' id='filter1'&gt;Filter 1&lt;/a&gt; | 
      &lt;a href='#' id='filter2'&gt;Filter 2&lt;/a&gt; | 
      &lt;a href='#' id='filter3'&gt;Filter 2&lt;/a&gt; |
      and so on...
      &lt;div class='clear'&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div id="divIssueMenu"&gt;
      Menu
  
      &lt;div id="rpMenu_divMenu_0" class="filter1"&gt;
         data here...
      &lt;/div&gt;
  
      &lt;div id="rpMenu_divMenu_1" class="filter2"&gt;
          more data...
      &lt;/div&gt;
  
      &lt;div id="rpMenu_divMenu_2" class="filter1 filter2"&gt;
          more data...
      &lt;/div&gt;
  
      &lt;div id="rpMenu_divMenu_3" class="filter1 filter2 filter3"&gt;
          more data...
      &lt;/div&gt;
  
  
      and so on, about 2000+ records...
  &lt;/div&gt;
  </code></pre>
  
  <p>Any way to make this more efficient? Is that the issue?
  Thanks in advance!</p>