title: Issue On SlideToggle Open Slides in jQuery
body: <p>I have a jQuery function which is suppose to slide down and up the sub menu under some <code>&lt;li&gt;</code> elements.</p>
  
  <pre><code>&lt;li class="subtop"&gt;&lt;a href="#"&gt;Sample 1&lt;/a&gt;
      &lt;ul class="sub-menu"&gt;
             &lt;li&gt;&lt;a href="#"&gt;Sample 1 - 1&lt;/a&gt;&lt;/li&gt;
             &lt;li&gt;&lt;a href="#"&gt;Sample 1 - 2&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/li&gt;  
  .....
  &lt;li class="subtop"&gt;&lt;a href="#"&gt;Sample 6&lt;/a&gt;
      &lt;ul class="sub-menu"&gt;
             &lt;li&gt;&lt;a href="#"&gt;Sample 6 - 1&lt;/a&gt;&lt;/li&gt;
             &lt;li&gt;&lt;a href="#"&gt;Sample 6 - 2&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/li&gt;  
  </code></pre>
  
  <p>and the jquery is like:</p>
  
  <pre><code>$(".subtop").click(function(ev){
     ev.stopPropagation();
     $(this).each(function(){
     $(".sub-menu", this).slideToggle();
    });
  });
  </code></pre>
  
  <p>the code is sliding the clicked element's sun menue up and down but I am not able to close existing open <code>sub-menu</code> when I click on another <code>subtop</code> can you please let me know  how to do this?</p>
  
  <p>Thanks</p>