// initialize the jquery code
 $j(document).ready(function(){
//close all the content divs on page load
$j('.pannel1').hide();
$j('.option1').hide();
$j('.pannel2').hide();
$j('.pannel3').hide();
$j('.pannel4').hide();

// toggle slide
$j('#pannel1').click(function(){
// by calling sibling, we can use same div for all demos
$j(this).siblings('.pannel1').slideToggle();
});
$j('#option1').click(function(){
// by calling sibling, we can use same div for all demos
$j(this).siblings('.option1').slideToggle();
});
$j('#pannel2').click(function(){
// by calling sibling, we can use same div for all demos
$j(this).siblings('.pannel2').slideToggle();
});
$j('#pannel3').click(function(){
// by calling sibling, we can use same div for all demos
$j(this).siblings('.pannel3').slideToggle();
});
$j('#pannel4').click(function(){
// by calling sibling, we can use same div for all demos
$j(this).siblings('.pannel4').slideToggle();
});
});