How to use jQuery slideDown() to display _almost_ all contents?
<p>I have a div within a div. On page load, they should both be hidden, then when I trigger the <code>slideDown()</code> function on the outer div, I want the inner div to remain hidden. How can I achieve this?</p>

<pre><code>&lt;script&gt;
$(function(){
    $('.body').hide();
    $('.display').click(function(){
        $(this).closest('.wrapper').find('.body').slideDown();
    });
});
&lt;/script&gt;

&lt;div class="wrapper"&gt;
    &lt;a class="display" href="#"&gt;Display Outer&lt;/a&gt;
    &lt;div class="body"&gt;
        Now displaying outer div
        &lt;div class="wrapper"&gt;
            &lt;a class="display" href="#"&gt;Display Inner&lt;/a&gt;
            &lt;div class="body"&gt;
                Now displaying inner div
            &lt;/div&gt;
        &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>Here is an example of it not working: <a href="http://jsfiddle.net/b7Tpt/" rel="nofollow">http://jsfiddle.net/b7Tpt/</a></p>
