title: jQuery .animate() sets display:none, how to avoid?
body: <p>I have the following code:</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div id="clickme"&gt;
      Click me  :-)
  &lt;/div&gt;
  
  &lt;div id="info" style="background:red; width:100%; height:100px; margin-bottom:-100px; z-index:20; position:absolute; bottom:0px;"&gt;
    Stay, damn!
  &lt;/div&gt;
  </code></pre>
  
  <p>JavaScript:</p>
  
  <pre><code>$('#clickme').click(function() {
      $('#info').animate({
          marginBottom: 'toggle'
      },{
          duration:500
      });
  });
  </code></pre>
  
  <p>It's also available at <a href="http://jsfiddle.net/DxnQJ/">http://jsfiddle.net/DxnQJ/</a></p>
  
  <p>Obviously, I want the <code>#info DIV</code> to appear/disappear whenever the <code>#clickme DIV</code> is clicked. It's working as intended, except that the <code>#info DIV</code> disappears after the animation due to jQuery setting its CSS <code>display</code> property to <code>none</code>.</p>
  
  <p>How can I tell jQuery to stop hiding my <code>DIV</code>?</p>