CODEWITHSUNDEEP
javascriptjqueryhtml
thindery
thindery

Reputation: 1194

jQuery finding closest image src to a div

if I have the following html:

<div class="showPin">
    <div class="pinIt" style="display: none;">
        <a href="#" onclick="window.open(&quot;http://pinterest.com/pin/create/button/?url=http://mysite.com/some-post&amp;description=Some Description&amp;media=http://mysite.com/path/to/myimage.jpg&quot;,&quot;Pinterest&quot;,&quot;scrollbars=no,menubar=no,width=600,height=380,resizable=yes,toolbar=no,location=no,status=no&quot;);return false;"><img src="images/pinbutton.jpg" class="pinbuttonImg"></a>
    </div>
    <a href="myimage.jpg">
        <img class="lazy data-lazy-ready" src="myimage.jpg" data-lazy-type="image" data-lazy-src="http://dev.papermusepress.com/stageblog/wp-content/uploads/2012/11/Fall_baby_shower_mantle2.jpg" alt="Fall Baby Shower Mantle" width="700" height="393" style="display: inline;">
    </a>
</div>

how can i get my alert function to work so it alerts the img src that is the actual image getting pinned, which has a class="lazy" always in it. 

$('div.pinIt').click(function() {
    var url = $(this).closest('img.lazy').attr('src');      
    alert(url);
});

all it alerts for me is undefined. what am i doing wrong?

Upvotes: 5

Views: 18992

Answers (2)

Sushanth --
Sushanth --

Reputation: 55740

$('div.pinIt').click(function() {
    var url = $(this).next('a').find('img.lazy').attr('src');      
    alert(url);
});

Closest traverses thru the ancestors. But the image is inside the sibling(anchor tag) of the div. So try it this way..

If you want to use .closest() then this should work..

$('div.pinIt').click(function() {
        var url = $(this).closest('.showPin').find('img.lazy').attr('src');      
        alert(url);
    });

Upvotes: 10

VisioN
VisioN

Reputation: 145398

One of the easiest ways is to go up to parent and search for image element inside:

$("div.pinIt").click(function() {
    var url = $(this).closest("div.showPin").find("img.lazy").attr("src");
    alert(url);
});

Upvotes: 2

Related Questions