jQuery slideToggle next container with class name

Hi all

I have a jsfiddle here - http://jsfiddle.net/bmdpamhy/

It’s three btns with content div’s below. The button and content containers have class names.

The content div’s are hidden.

I want to open just the content div below the button clicked.

How do I open just the div below the buton clicked.


/* This will open all content divs
$(function(){
    $('.open').click(function(){
        $('.content').slideToggle();
    });
})
*/


// I want to open just the content below the button clicked
$(function(){
    $('.open').click(function(){
        $(this).next('.content').slideToggle();
    });
})

Hi ttmt,

You can achieve what you need quite easily by going back up to the parent and traversing to the next child in the DOM.

$(this).parent().next().slideToggle();
1 Like