get href attribute of enclosing link tag

Question

Having a little trouble on this one. I need a way using Jquery/JS to find the HREF attribute of the enclosing link tag:

<a href="something.html"><img src="img1.jpg" class="active"></a>

I want to target the img by class and find the value of the 1st preceding href attribute.

$("img.active").somethingAwesome().attr("href");

Please show me somethingAwesome() ...help?

Answer 1

$("img.active").parent("a").attr("href") will get the direct parent's href attribute, assuming it's an anchor. If there's any depth of containing blocks between the image and the anchor, use instead $("img.active").closest("a").attr("href").

Answer 2

.parent() is all you need!

$("img.active").parent().attr("href");

Here is the documentation :)

As per Kyle's comment, and in an attempt to make something as robust as possible, you could try:

$("img.active").closest('a[href]').attr("href");

that way, even if your html looks like this:

<a href="something.html">
    <a name="anchor">
        <img src="img1.jpg" class="active">
    </a>
</a>

you'll still get what you need :)

Answer 3

$("img.active").closest("a").attr("href");

Answer 4

$("img.active").closest('a').attr("href");