title: Collapse div on click of child element
body: <p>I am trying to collapse parent div on click of child element like below</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div class="expand"&gt;
      &lt;h3&gt;expand this div&lt;/h3&gt;
      &lt;a href="#" class="collapse" style="display:none;"&gt;Collapse&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>.expand{
      border:2px dotted green;
  }
  </code></pre>
  
  <p><strong>jQuery</strong></p>
  
  <pre><code>$('.expand').click(function(){
      $(this).stop().animate({
          width:'300px',
          height:'300px'
      });
      $('.collapse').show();
  });
  
   $('.collapse').on('click',function(){
       $('.expand').stop().animate({
           width: '300px',
           height:'50px'
       });
   });
  </code></pre>
  
  <p>It's not working, I've tried using <code>$(this).parent().animation()</code> too, but that also dosen't work.</p>
  
  <p>What changes should be done here ?</p>
  
  <p><a href="http://jsfiddle.net/nvR2S/" rel="nofollow"><strong>LIVE FIDDLE HERE</strong></a></p>