CODEWITHSUNDEEP
jquery
Enayet Hussain
Enayet Hussain

Reputation: 1018

How to go around using .slideUp() or .slideDown() only on specific child

I currently have multiple items displayed on a page that have their description hidden by default. The description can be shown by pressing the div with the class .morebtn however the jquery code has no way of uniquely identifying which .morebtn relates to which description (.desc)

<div>
   <span class="item">Item Name</span>
   <div class="btn addbtn" alt="Add to your basket"></div>
   <div class="btn morebtn" alt="More information"></div>
   <div class="desc">Hello this is a test description for the above item. </div>
<div>

There will be multiple instances of the code above depending upon the amount of item entries in my database. What would be the best way to make it so I can get the morebtn to only show the description of the desc within the same div?

Upvotes: 0

Views: 30

Answers (1)

Kalpesh Patel
Kalpesh Patel

Reputation: 2822

Use something like this:

$(document).ready(function() {
     $("body").on("click",".morebtn",function() {
         var ele = $(this);
         $(this).next(".desc").toggle();
     });
});

Upvotes: 1

Related Questions