Reputation: 89
I thought that the closest()
function would do this for me, but seemingly not. I have the following markup and I want to add a class
to all parent anchors with the class trigger:
<ul>
<li class="selected">
<a class="trigger" href=""></a>
<a href=""></a>
<ul>
<li class="selected">
<a class="trigger" href=""></a>
<a href="" id = "my_target"></a>
</li>
</ul>
</li>
</ul>
I want to select my target - in this example, the deepest anchor, then add a class
to each a.trigger
in its ascendants. What would be the best way to do this? Thanks.
Upvotes: 5
Views: 5525
Reputation: 150919
Here's an example using a combination of jQuery.parents()
(to get the containing <li>
tags) and then jQuery.children()
to get the <a>
tags with a class of trigger:
$(document).ready( function() {
$('#my_target').click( function(e) {
$(this).parents('li.selected').children('a.trigger').addClass('myclass');
e.preventDefault();
});
});
EDIT:
Note $().parents()
traverses all the way up the tree, but $().children()
only traverses down one level. To gather all descendents of an element use $().find()
.
Upvotes: 3
Reputation: 2718
parents
Is used for traversing up.
I believe this should work:
$('#my_target').parents('.trigger').addClass('myclass');
However for siblings you'll need to use siblings
instead of parents
For example the anchor
tag that is with the #my_target
anchor is considered a sibling.
Upvotes: 0