title: Toggle class with jQuery
body: <p>I would need to hide a div when user clicks a link.</p>
  
  <p>The html is something like this:</p>
  
  <pre><code>&lt;div class="item"&gt;
  &lt;div class="entry"&gt;
  Lorem ipsum
  &lt;/div&gt;
  &lt;a href="#" class="commentsToggle"&gt;Show/hide comments&lt;/a&gt;
  &lt;div class="comments hidden"&gt;
  This comments div I want show/hide
  &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div class="item"&gt;
  &lt;div class="entry"&gt;
  Lorem ipsum
  &lt;/div&gt;
  &lt;a href="#" class="commentsToggle"&gt;Show/hide comments&lt;/a&gt;
  &lt;div class="comments hidden"&gt;
  This comments div I want show/hide
  &lt;/div&gt;
  &lt;/div&gt;
  
  ....there's multiple items after this
  </code></pre>
  
  <p>As a default the comments are hidden (hence the class hidden there). Now if user clicks the Show/hide comments link it should show or hide comments for that specific item, depending are they visible or not. Now the question is do I need some id's to control js to hook only to that one specicif items ocmments and can I do it witouh id?</p>
  
  <p>The js is something like atm:</p>
  
  <pre><code>$('.item .commentsToggle').click(function(){
          elem = $(this).parents('.item');
  
          $(elem).find('.comments').each(function() {
              $(this).toggleClass('hidden');
          });
      });
  </code></pre>
  
  <p>If there's only one item that works but if multiple it breaks up :/</p>
  
  <p>This is pretty simple.. I just dont get it into my head how to do it actually :D</p>