title: Toggle show\hide with jquery but with multiple ids
body: <p>I have a php page wich generates multiple ULs and a link above each UL, like this</p>
  
  <pre><code>&lt;a title="Category one" id="cat-1"&gt; Category one &lt;/a&gt;
    &lt;ul id="subcategory-1-ul"&gt;
      &lt;li&gt;Subcategory&lt;li/&gt;
      &lt;li&gt;Subcategory&lt;/li&gt;
    &lt;ul&gt;
  
  &lt;a title="Category two" id="cat-2"&gt; Category two &lt;/a&gt;
    &lt;ul id="subcategory-2-ul"&gt;
      &lt;li&gt;Subcategory&lt;li/&gt;
      &lt;li&gt;Subcategory&lt;/li&gt;
    &lt;ul&gt;
  </code></pre>
  
  <p>Because there are many subcategories into each main categories I want to hide the ULs and only show them when I click the anchor.</p>
  
  <p>I'm trying to use this jquery:</p>
  
  <pre><code>$(document).ready(function() {
           $('#toggle-link').click(function() {
              $('#ul-to-hideshow').toggle('slow');
           });
          })
  </code></pre>
  
  <p>This works ok but only for the first UL and an anchor with the same id. I need to modify it somehow to pass the id of each UL or anchor and toggle each UL on and off. I have unique ID for each anchor and its UL.</p>
  
  <p>How do I modify the script ?</p>