Toggle only the current div after you click its own toggle button?
<p>I have the following HTML structure:</p>

<p>(jade template language)</p>

<pre><code>#review-item-1.review-item
      a.submit-review-toggle(href="#").review-item-toggle +
      h3 Service
      .review-overview
        textarea(class='submit-review-overview', name='message', placeholder='Overview')
      .review-photo
        img(src="images/no-photo.png")
</code></pre>

<p>I want to be able to expand and collapse the height of the <code>.review-item div</code> (at the top):</p>

<pre><code>$(".submit-review-toggle").click(function() {
    $(".review-item").animate({
        height: "toggle",
    }, "slow");
});
</code></pre>

<p>The problem is that I will have a lot of <code>.review-item</code> divs in a single page. So I need to just toggle the 'current' <code>.review-item</code> div after you click its own <code>.submit-review-toggle</code> button.</p>

<p>Any suggestions of how to accomplish this?</p>
