CODEWITHSUNDEEP
javascriptjqueryjquery-selectors
DT.DTDG
DT.DTDG

Reputation: 765

Finding the next div with class in JQuery

I'm creating multiple toggles, however, the toggle div's named "slide-tips" are sitting outside the div where the "toggle" is clicked. What I'm trying to do is find the next "slide-tips" and perform the toggle on that.

Original code:

$(document).ready(function(){
  var $content = $(".slide-tips").hide();
  $(".toggle").bind("click", function(e){
    $(this).toggleClass("expanded");
    $(this).next().slideToggle();
  });
});

I changed $(this).next().slideToggle(); to $(this).next().find('.slide-tips:first').slideToggle(); but no luck.

Html is as follows:

<div id="content">
  <div class="toggle">Expand</div>
</div>
<div class="slide-tips">First tip content
</div>

<div id="content">
  <div class="toggle">Expand</div>
</div>
<div class="slide-tips">Second tip content
</div>

Upvotes: 0

Views: 86

Answers (1)

tymeJV
tymeJV

Reputation: 104775

You want:

$(this).parent().next(".slide-tips").slideToggle();

Demo: http://jsfiddle.net/wzCA7/

Upvotes: 1

Related Questions