The code below simply shows and hides a div (content) when you click on the heading (heading).
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery(".content").hide();
//toggle the componenet with class msg_body
jQuery(".heading").click(function()
{
jQuery(this).next(".content").slideToggle(0);
});
});
</script>
Demo - http://www.designgala.com/demos/collapse-expand-jquery.html
By default, the content is always hidden - Is there any way to have the content showing by default? I'm using a number of these on a page, some will need to be showing by default, others will have to be hidden. Just wondering how to maybe add a bit to the code to make both possible?