Pulling Second Image Source Instead of First Using JQuery

I am new to jquery and I am trying to scrape the image source of the second img tag within a div, but can't seem to figure out the correct syntax to pull the second image by id. I feel like this isn't complicated to do, but after trying multiple ways of doing it I'm still stuck and keep getting an "undefined" error. Also not sure if "find" is not the best way to pull this and maybe I should be using something like "getElementbyID"?

Here is the source code I am trying to pull from:

<div class="mainImage" style="width:438px; height:333px;">
        <img src="images/default/zoom.png" alt="Click here to see slideshow" 
        title="Click here to see slideshow" class="zoom" style="display: none;">
        <img id="property_image" 
        src="http://website.com/images/assets/6695_18262.jpg" show="1" 
        style="width: 438px; height: 333px;">
</div>

Here is what I have:

$('.mainImage').each(function(i, element){
        var imgID = $(element).find('img');
        var img = $(imgID).find('#property_image').attr('src');

        console.log (img);

Any help is much appreciated!

1 answer

  • answered 2017-11-12 20:37 Akansh Gulati

    You can simply, use

    var img = $('#property_image');
    console.log(img.attr('src'));