title: Revealing a UL on click in jQuery
body: <p>I have some problems and hoping you could help.</p>
  
  <p>I have the following HTML code </p>
  
  <pre><code>&lt;h4&gt;&lt;a class="trigger"&gt;Click &lt;/a&gt;&lt;/h4&gt;
  
  &lt;ul class="panel"&gt;
  &lt;li&gt;List items bla bla bla &lt;/li&gt;
  &lt;li&gt;List items bla bla bla &lt;/li&gt;
  &lt;li&gt;List items bla bla bla &lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;h4&gt;&lt;a class="trigger"&gt;Click &lt;/a&gt;&lt;/h4&gt;
  
  &lt;ul class="panel"&gt;
  &lt;li&gt;List items bla bla bla &lt;/li&gt;
  &lt;li&gt;List items bla bla bla &lt;/li&gt;
  &lt;li&gt;List items bla bla bla &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>And I would like that on click it toggles. I have the following code in jQuery:</p>
  
  <pre><code>$(function(){
  
      $('ul.panel').hide();
      $("a.trigger").click(function(){
          $("ul.panel").slideToggle("fast");
          $(this).toggleClass("active");
          return false;
      });
  });
  </code></pre>
  
  <p>Now I know it won't work because it's selecting ALL items. How can I use it so it only toggles the actual trigger that was clicked and not toggle all of them? I have tried to use FIND, SIBLINGS, NEXT, etc but I can't.</p>
  
  <p>Any help, appreciated.</p>
  
  <p>Thank you!!</p>