mike
mike

Reputation: 8141

jquery next() outside of div

I'm trying to use next() to toggle a div. The problem is that the "trigger" is in a different div than the one I want to toggle. An example that works:

$("span.trigger").click(function(){
        $(this).next("div.task_description").slideToggle("fast");
});

<span class="trigger">The trigger</span>
<div class="task_description ">
  some content
</div>

But the way I need the html setup is:

<div>
  <span class="trigger">The trigger</span>
</div>
<div class="task_description ">
  some content
</div>

That doesn't work... any suggestions?

Upvotes: 0

Views: 781

Answers (1)

Nick Craver
Nick Craver

Reputation: 630389

In this case you need a .parent() as well, like this:

$("span.trigger").click(function(){
  $(this).parent().next("div.task_description").slideToggle("fast");
});

Alternatively, if your nesting may change, you can go up to the <div> you're in, like this:

$(this).closest("div").next("div.task_description").slideToggle("fast");

Upvotes: 3

Related Questions