Sliding div's - advice needed
<p>Just made this code to hide div's until the title is clicked, works perfectly, only now I have three divs under each other and I just want the first one to be expanded, then when another one is clicked the one that was open to close and the new one to expand. My Jquery is below</p>

<pre><code>$(function(){
    $('.drop-dwn').click(function(){
        $(this).next('.slide1').slideToggle(300);
        return false;
    });
});
</code></pre>

<p>My HTML Markup is:</p>

<pre><code>&lt;div class="slide-panels"&gt;
                    &lt;h4 class="drop-dwn"&gt;Oil &amp; Gas&lt;/h4&gt;
                        &lt;div class="slide1"&gt;
                            &lt;div class="checkbox"&gt;&lt;input type="checkbox" name="" value=""&gt; All&lt;/div&gt;
                            &lt;div class="checkbox"&gt;&lt;input type="checkbox" name="" value=""&gt; All&lt;/div&gt;
                            &lt;div class="checkbox"&gt;&lt;input type="checkbox" name="" value=""&gt; All&lt;/div&gt;
                        &lt;/div&gt;
                    &lt;h4&gt;SAP &amp; Enterprise Solutions&lt;/h4&gt;
                        &lt;div class="slide2"&gt;
                            &lt;div class="checkbox"&gt;&lt;input type="checkbox" name="" value=""&gt; All&lt;/div&gt;
                            &lt;div class="checkbox"&gt;&lt;input type="checkbox" name="" value=""&gt; All&lt;/div&gt;
                            &lt;div class="checkbox"&gt;&lt;input type="checkbox" name="" value=""&gt; All&lt;/div&gt;
                        &lt;/div&gt;
                    &lt;h4&gt;IT &amp; Change Management&lt;/h4&gt;
                        &lt;div class="slide3"&gt;
                            &lt;div class="checkbox"&gt;&lt;input type="checkbox" name="" value=""&gt; All&lt;/div&gt;
                            &lt;div class="checkbox"&gt;&lt;input type="checkbox" name="" value=""&gt; All&lt;/div&gt;
                            &lt;div class="checkbox"&gt;&lt;input type="checkbox" name="" value=""&gt; All&lt;/div&gt;
                        &lt;/div&gt;
                     &lt;/div&gt;
</code></pre>
