title: jquery slideToggle weirdness
body: <p>I have a menu that on .click triggers a slideToggle to show/hide elements of a list.</p>
  
  <p>When the page first loads, all elements of the list are visible. As you click on the menu, which corresponds to the different elements in the list, different parts slide away. The menu looks like this:</p>
  
  <pre><code>One | Two | Three
  </code></pre>
  
  <p>The list looks like this:</p>
  
  <pre><code>&lt;li class="one"&gt;Here's one thing&lt;/li&gt;
  &lt;li class="two"&gt;Here's another thing&lt;/li&gt;
  &lt;li class="three"&gt;Here's a third thing&lt;/li&gt;
  </code></pre>
  
  <p>And what happens is when you click on ONE, two and three slide up, so you're only seeing the items with .one. That does happen. And when you click again on ONE, two and three slide down, so you're seeing everything again. That's exactly right.</p>
  
  <p>However, things get weird, if you don't click back on ONE to expand the list, and instead jump to TWO: The expected action would be that you would now see items in the "two" class, without seeing .one and .three. Instead, you see ONLY .three clicking on THREE then shows you .one and .two and hides .three</p>
  
  <p>That's a mess. Here's how I'm calling these right now:</p>
  
  <pre><code>$('#clickone').click(function(){
  $('#result li:not(.one)').slideToggle();});
  
  $('#clicktwo').click(function(){
  $('#result li:not(.two)').slideToggle();});
  
  $('#clickthree').click(function(){
  $('#result li:not(.three)').slideToggle();});
  </code></pre>
  
  <p>There's got to be a method that simply works, right?</p>