Question

I am using the following piece of jQuery code:

    $('div#addMenu1').click(function(){
    if (!menuSet1){
        menuSet1 = true;
                    $('div#sliderOne').slideDown('slow');
                    $('img', this).attr('src', 'Green_Up.png');
                    $('img', this).attr('title', 'Collapse');
                    $('div#sliderOne').css("background-color", "#cee8ff");
    }
    else {
        menuSet1 = false;
                    $('div#sliderOne').slideUp('slow');
                    $('img', this).attr('src', 'Green_Down.png');
                    $('img', this).attr('title', 'Create a top menu item');
    }
});

The thing is though, I would like to reuse the same bit of code but be able to also check for div#addMenu[1234] as well as set menuSet[1234] and change img title.

Any idea how I can reuse this code but based on the div section the user clicks on, pass the section number, say 3 and new title for img, to this code, so it would be using:

        $('div#addMenu3').click(function(){
    if (!menuSet1){
        menuSet3 = true;
                    $('div#sliderOne').slideDown('slow');
                    $('img', this).attr('src', 'Green_Up.png');
                    $('img', this).attr('title', 'Collapse');
                    $('div#sliderOne').css("background-color", "#cee8ff");
    }
    else {
        menuSet3 = false;
                    $('div#sliderOne').slideUp('slow');
                    $('img', this).attr('src', 'Green_Down.png');
                    $('img', this).attr('title', 'Create a Level 3 menu item');
    }
});

Answer 1

I’m not sure if this covers the scope of your question, but jQuery UI provides an accordion control which covers what you seem to want to do.