Question

I created one accordion menu, issue is I am using .next on li but the div are not slideToggle. and I want this time to make it like accordion menu.

1. Want to open the div when I will click on parent li,
2. When I click on the other li it’s div will slide but other li div should be close.

Here is the demo link: http://jsfiddle.net/H4ueq/. Please help me.

Answer 1

You can just use children(“div”) instead of next(), since it’s the child of the clicked li element that you want to slide-toggle. Use slideUp and slideDown instead of toggle, that will produce the accordion functionality.

See here:

http://jsfiddle.net/45Yab/3/

$("ul#accordian>li").click(function() {
    $("#accordian").find("div[class=details]").slideUp("slow");
    $(this).children("div[class=details]").slideDown("slow");
});​