I am trying to grab the closest link with the class a.tariff-link and send it to a method, but looks like closest() cannot find it because it's always passing an undefined element.

$(".ui-icon-triangle-1-e").click(function () {

    GetRuleData($(this).closest("a.tariff-link"));

});

An example of HTML would be like this:

<h3 class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" role="tab" aria-expanded="false" tabindex="-1">
<span class="ui-icon ui-icon-triangle-1-e"></span>
<a id="41965" class="tariff-link" href="#" tabindex="-1">
</h3>

I am trying to grab the closest link with the class a.tariff-link and send it to a method, but looks like closest() cannot find it because it's always passing an undefined element.

$(".ui-icon-triangle-1-e").click(function () {

    GetRuleData($(this).closest("a.tariff-link"));

});

An example of HTML would be like this:

<h3 class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" role="tab" aria-expanded="false" tabindex="-1">
<span class="ui-icon ui-icon-triangle-1-e"></span>
<a id="41965" class="tariff-link" href="#" tabindex="-1">
</h3>

• javascript
• jquery

• 4 Read the documentation on .closest(). It gets the closest parent, not sibling child or cousin. – Kevin B Commented Jun 28, 2012 at 19:09
• Closest beginning at the current element and progressing up through the DOM. – Ricardo Lohmann Commented Jun 28, 2012 at 19:09

2 Answers 2

You need .siblings() instead of .closest(). The latter checks the current element and its ancestors but your a is a sibling of the current element, not an ancestor.

If it's always the element right after the current element you could also use .next().

try:

GetRuleData($(this).next("a.tariff-link"));