Can't animating the height of the closest parent of a toggle button?
<p>I'm trying to animate the height of the closest parent of a toggle button: </p>

<p>CSS</p>

<pre><code>    .review-item {
        background: #E8E8E2;
        height: 26px;
        margin-top: 15px;
        overflow: hidden;
        padding: 15px;
</code></pre>

<p>(etc.)</p>

<p>JS:</p>

<pre><code>    $(".submit-review-toggle").toggle(function(){
        $(this).closest('.review-item').animate({height:168},200);
    },function(){
        $(this).closest('.review-item').animate({height:26},200);
    });
</code></pre>

<p>HTML:</p>

<pre><code>  &lt;div id="review-item-1" class="review-item"&gt;
    &lt;a href="#" class="submit-review-toggle review-item-toggle"&gt;+&lt;/a&gt;

    &lt;h3&gt;Service&lt;/h3&gt;

    &lt;div class="review-overview"&gt;
      &lt;textarea name="message" placeholder="Overview" class="submit-review-overview"&gt;
&lt;/textarea&gt;
    &lt;/div&gt;

    &lt;div class="review-photo"&gt;
      &lt;img src="images/no-photo.png" /&gt;

      &lt;div class="review-photo-upload"&gt;
        &lt;input type="file" class="file-upload" /&gt;&lt;a href="#" class=
        "facebook-import"&gt;Import pictures from Facebook&lt;/a&gt;
      &lt;/div&gt;&lt;input type="text" placeholder="Caption" class="caption" /&gt;
    &lt;/div&gt;
  &lt;/div&gt;
</code></pre>

<p>For some reason, when i click the link nothing happen.
Any suggestions to fix this?</p>
