title: jQuery toggle multiple divs within other divs independently
body: <p>I've checked through the related questions but I haven't found the right combination of things to make this work.</p>
  
  <p>I'm trying to hide / show a div within a another div. There are 20 of such wrapper divs per page.</p>
  
  <pre><code>&lt;div class="wrapper"&gt;
      &lt;div class="date"&gt;&lt;/div&gt;
      &lt;div class="subject"&gt;&lt;/div&gt;
      &lt;div class="who"&gt;&lt;/div&gt;
      &lt;div class="body"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I'm trying to show the class="body" div which is set to display:none; in css.</p>
  
  <p>I've tried using the jQuery toggle(), toggleClass() functions with no success.</p>
  
  <p>Here's what I've got so far.</p>
  
  <pre><code>$('.wrapper').click(function () {
      $('.body').toggle();
  });
  </code></pre>
  
  <p>I know it's a very tiny piece of code, sadly I've just started to learn jQuery and don't know how to proceed from this.</p>