Question

There is a JQuery accordion :

<script type="text/javascript" >

    $(document).ready(function() {

        $('div.accordionButton').click(function() {
            $('div.accordionContent').slideUp('slow');  
            $(this).next().slideDown('slow');
        });
        $("div.accordionContent").hide();

    });

</script>

When I first click an object div “accordionButton” then its sub-content is shown by slide. How to hide this sub-content by re-clicking the object div “accordionButton” ?

Answer 1

It Works !

$(document).ready(function() {

    $('div.accordionButton').click(function() {
        $('div.accordionContent').slideUp('slow');  
        if(!$(this).next().is(':visible')){
        $(this).next().slideDown('slow');
        }
    });
    $("div.accordionContent").hide();


});​

http://jsfiddle.net/ipsjolly/m4BTd/

Updated Fiddle:-

http://jsfiddle.net/ipsjolly/m4BTd/1/