Sorting class with jQuery
<p>I created jQuery sorter plugin like below to filter by classes.  But now I am not sure how to only display <code>class="apple"</code> by default.  Right now when I reload the page both APPLE and TREE is visible.</p>

<pre><code>&lt;ul&gt;
  &lt;li class="apple"&gt;APPLE&lt;/li&gt;
  &lt;li class="tree"&gt;TREE&lt;/li&gt;
  &lt;li class="apple tree"&gt;ALL&lt;/li&gt;
&lt;/ul&gt;

&lt;div&gt;
  &lt;div class="apple"&gt;APPLE&lt;/div&gt;
  &lt;div class="tree"&gt;TREE&lt;/div&gt;
  &lt;div class="apple"&gt;APPLE&lt;/div&gt;
  &lt;div class="tree"&gt;TREE&lt;/div&gt;
  &lt;div class="apple"&gt;APPLE&lt;/div&gt;
  &lt;div class="tree"&gt;TREE&lt;/div&gt;
&lt;/div&gt;

&lt;script src="/js/jquery.min.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;
$("ul li").click(function() {
  visibleClasses = $(this).attr("class").split(" ");
  $("div div").hide(); // or slideUp / fadeOut
  for(i in visibleClasses) {
    $("div div."+visibleClasses[i]).fadeIn(500); // or slideDown / show
  }
});
&lt;/script&gt;
</code></pre>
