I'm currently having a problem:
I have different elements in my html. All except the first one having a class called "inactive" and I want them click by click (on each cell) to become active (remove "inactive" attribute).
Clicking the first, will activate the second. Clicking the second, will activate the third. And so on.
Here is my html.
<div class="around">
<div class="row">
<div class="cell">text 1</div>
</div>
<div class="row inactive">
<div class="cell">text 2</div>
</div>
<div class="row inactive">
<div class="cell">text 3</div>
</div>
</div>
here is my jquery (found that on stackoverflow)
$( document ).ready(function() {
$( ".cell" ).click(function() {
$(this).closest('.around').next().find('.inactive').removeClass('inactive');
});
});
This will do... nothing.
I also tried:
$(this).closest('.around').find('.inactive').removeClass('inactive');
});
But this will remove "inactive" class from all elements
Can anyone help please?
If you want to removeclass from parent of clicked element, You need to traverse to parent element using .parent() :
$( ".cell" ).click(function() {
$(this).parent().removeClass('inactive');
});
If you want to remove the class from next sibling element of clicked parent, then use .parent() along with .next():
$( ".cell" ).click(function() {
$(this).parent().next().removeClass('inactive');
});
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments