Question

I have the following html code:

<div class="first-div">
    <p><a>click this</a></p>
</div>
<br />
<div class="second">
    <p>show this</p>
</div>

I hide .second on document load. When I click the only anchor, I want to select the div with class second, tried everything but still no luck.

This is my JavaScript:

$(document).ready(function(e) {
    $(".second").hide()
    $("a").click(function(e) {
        $(this).parent().parent().next(".second").toggle()
    });
});

Also, I have several of those divs loaded dynamically in PHP.

Answer 1

Change,

$(this).parent().parent().next(".second").toggle()

to

$(this).parent().parent().nextAll(".second").toggle()

next element is not .second but br.

Also,

$(this).closest('.first-div').nextAll(".second").toggle() should work.