jquery content hide/show panels
<p>I didn't write this code myself but a colleges has asked me to help resolve an issue. I'm not having much look with google so thought I'd give it a shot here.</p>

<pre><code>function($) {
 var accordion = $('dl &gt; dd').hide().slice(0, 1).show();

 $('dl &gt; dt &gt; a').click(function() {
 accordion.slideUp();
 if($(this).parent().next().is(':hidden'))
 { 
   $(this).parent().next().slideDown();
 }
 return false;
});
})(jQuery);
</code></pre>

<p>This code is supposed to open and close panels on the page. </p>

<p>If we change this line </p>

<pre><code> var accordion = $('dl &gt; dd').hide().slice(0, 1).show();
</code></pre>

<p>to this line</p>

<pre><code> var accordion = $('dl &gt; dd').hide();
</code></pre>

<p>Everything works as should but we would like the first panel to show when the page loads.</p>

<p>With the code as is when you open a panel the open ones don't close.</p>
