jQuery - Finding next Div

Question

I am trying to find the next div after an input button and toggle it.

What am I doing wrong?

JS:

$(\".showNextExperience\").click(function() {
          


        

Answer 1

Assuming you have elements between triggering input and manipulated div:

<input class="showNextExperience" >
<p>Hello, new line</p>
<div class="experience">Experience 1</div>

<input class="showNextExperience">
<p>Some text</p>
<div>And an info block</div>
<div class="experience">Experience 2</div>

Then you have to use nextAll to search not only for the very next element but through the whole DOM, which is probably simpler coding than using next().find():

$(".showNextExperience").click(function() {
    $(this).nextAll(".experience").toggle();
});

Answer 2

$(this).siblingings().eq(0) should to do it.

Answer 3

$(".showNextExperience").click(function() {
    $(this).next().show();
});

Answer 4

Simply:

$(".showNextExperience").click(function() {
    $(this).next(".experience").toggle();
});

See:

• http://api.jquery.com/toggle/
• http://api.jquery.com/next/

Answer 5

Try this

$(".showNextExperience").click(function() {
    $(this).next("div.experience").toggle();
});