Reputation: 111
i wonder if it is possible to do an event only on the element clicked, although this element have the same class, and if inside or next to this element there is a div with the class 'subcategory', show it using toggleClass method. here the html.
<ul>
<li class="catname">something</li>
<li class="catname">
something
<div class="subcategory none">some hidden content to show</div>
</li>
<li class="catname">something</li>
</ul>
This is what I tried:
$(document).on("click",".catname", function (event) {
$(".subcategory").next().toggleClass('none')
});
Also this:
$(".catname").bind("click", function() {
$(".subcategory").next().toggleClass('none')
});
Thank you
Upvotes: 2
Views: 2741
Reputation: 337713
You should use the this
keyword within the click handler to reference the element which raised the event. From there you can traverse the DOM to find()
the inner element. Try this:
$(document).on('click', '.catname', function (event) {
$(this).find('.subcategory').toggleClass('none');
});
Upvotes: 2