Question

each div has one image having fixed class. i need to change all images src inside those div which has class called “.diagnostic_picture” using jquery and also add one new attribute to all the images called “delaySrc” inside that div having class called “.diagnostic_picture”. here this way wrote the code but did not work….can anyone help me. thanks

<div class="diagnostic_picture"><img src="test1.gif" /></div>
<div class="diagnostic_picture"><img src="test2.gif" /></div>
<div class="diagnostic_picture"><img src="test3.gif" /></div>

 $(document).ready(function () {
        $(".diagnostic_picture").each(function () {
            $(this).children("img")
            .attr("src", 'images/ajax-loader.gif')       // this way i change the src
            .attr('delaySrc', $this.attr("src")); ;      // this way i add new attribute
        });
    });

the attribute called delaySrc not being added to img tag inside the div so i change the code bit but still new attribute not being added….i check source by firebug.

change code

  $(".diagnostic_picture img").each(function () {
        var img = $(this);
        img.attr("delaySrc", function () { img.attr("src") })
        img.attr("src", 'images/ajax-loader.gif');
    });

Answer 1

This is the correct version of your code (note both the changes in html makrup – class values do not need prefix dot, and in javascipt)

<div class="diagnostic_picture"><img src="test1.gif" ></div>
<div class="diagnostic_picture"><img src="test2.gif" ></div>
<div class="diagnostic_picture"><img src="test3.gif" ></div>

 $(document).ready(function () {
        $(".diagnostic_picture img").attr("src", 'images/ajax-loader.gif').attr('delaySrc', function() { $(this).attr("src") });
     });
 });