CODEWITHSUNDEEP
javascriptjqueryslidedown
user1310420
user1310420

Reputation:

Jquery slidedown one element in div

I have a div like this:

<div>
  <font class='slideclick'>Click here to slidedown dynamic content</font>
  <div class='slidedownonclick'> This is the content that slides down </div>
</div>

Jquery triggers the 'slidedownonclick' to slidedown when 'slideclick' is clicked. This works great but i have and indefinite amount on these div's reccuring in the same webpage, from a mysql database. Giving them unique id's is impossible. Is there any way that i could get only the 'slidedownonclick' in the same div as its respective 'slideclick' to slidedown when it is clicked.

Any help would be much appreciated,

thanks,

Upvotes: 2

Views: 653

Answers (4)

Ricardo Lohmann
Ricardo Lohmann

Reputation: 26320

Check about jQuery.next(), it's what do you want.
Using it you can get the next sibbling which class/id is the selector.
EDITED:

until jQuery 1.6.4

   jQuery(document).delegate('font.slideclick', 'click', function() {
        jQuery(this).next('slidedownonclick').slideToggle();
    });

jQuery 1.7 +

jQuery(document).on('click', 'font.slideclick', function() {
    jQuery(this).next('slidedownonclick').slideToggle();
});

Upvotes: 0

Fabrizio Calderan
Fabrizio Calderan

Reputation: 123377

On a .slideclick handler you will find that sibling with:

$(this).find('+ .slidedownonclick');

or: 

$(this).next('.slidedownonclick');

Upvotes: 1

Goldie
Goldie

Reputation: 1630

$('.slideclick').click(function() {
 $(this).next('.slidedownonclick').animate({
    height: '+=50'
  }, 1000);
});

Upvotes: 0

Bojangles
Bojangles

Reputation: 101473

This will slide down the next .slidedownonclick div when .slideclick is clicked:

$('.slideclick').click(function() {
    $(this).next('.slidedownonclick').slideDown();
});

Upvotes: 1

Related Questions