Toggle the next ul in li
<p>I want to toggle the ul when I click on group1 or group2</p>

<p>HTML</p>

<pre><code>&lt;li class="sort"&gt;
  &lt;span&gt;&lt;/span&gt;
  &lt;a class='expand'&gt;Group1&lt;/a&gt;
  &lt;a style='padding-right:10px; float:right' href='#'&gt;Delete&lt;/a&gt;
  &lt;a style='padding-right:10px; float:right' href='#'&gt;Edit&lt;/a&gt;
  &lt;ul id="0" style='display:none'&gt;
    &lt;li style='border:none' id="1" class='sort'&gt;
        &lt;span&gt;&lt;/span&gt;
        &lt;a href='#'&gt;Patent 1&lt;/a&gt;
        &lt;em style='padding-left: 60px;'&gt;The description of patent 1&lt;/em&gt;
        &lt;a style='padding-right:10px; float:right' href='#'&gt;Delete&lt;/a&gt;
        &lt;a style='padding-right:10px; float:right' href='#'&gt;Edit&lt;/a&gt;
    &lt;/li&gt;
    &lt;li style='border:none' id="2" class='sort'&gt;
        &lt;span&gt;&lt;/span&gt;
        &lt;a href='#'&gt;Patent 2&lt;/a&gt;
        &lt;em style='padding-left: 60px;'&gt;The description of patent 2&lt;/em&gt;
        &lt;a style='padding-right:10px; float:right' href='#'&gt;Delete&lt;/a&gt;
        &lt;a style='padding-right:10px; float:right' href='#'&gt;Edit&lt;/a&gt;
    &lt;/li&gt;
  &lt;/ul&gt;
&lt;/li&gt;
</code></pre>

<p>I tried </p>

<pre><code> &lt;script&gt;
  $(document).ready(function(){
    $('.expand').click(function() {
        $(this).next('ul').slideToggle('slow');
    });
});
&lt;/script&gt;
</code></pre>

<p>Thanks</p>
