CODEWITHSUNDEEP
javascriptjqueryprepend
alipkok
alipkok

Reputation: 67

Adding image prepend is not appearing

i am a newbie to Javascript/jQUERY . Im loading a div from a url using load() .Then i would like to insert an image on the left on a span . Im using prepend but the image is not loading.When im running the code from console the image is loading properly.

$(document).ready(function() {


    var $div1 = $("<div></div>")
    var $div2 = $("<div></div>")
    $div1.attr("id", "div1");
    $div2.attr("id", "div2");

    $("#a_30").append($div1);
    $("#a_30").append($div2);

    var $posts = $('a.entry_title').map(function() {
        return $(this).attr('href');
    });

    var id1 = $posts[0].substring($posts[0].lastIndexOf('_') + 1);
    var id2 = $posts[1].substring($posts[1].lastIndexOf('_') + 1);

    var posts = ["url/open/" + id1, "url/open/" + id2]
    $('#div1').load(posts[0] + " .shadow3");
    $('#div2').load(posts[1] + " .shadow3");

    $('#div1').find('.entry_').prepend('<img id="MsgIcon" src="/email.gif" />');
    $('#div2').find('.entry_').prepend('<img id="MsgIcon" src="/email.gif" />');

});

Upvotes: 1

Views: 50

Answers (1)

Tushar
Tushar

Reputation: 87203

Because load() is asynchronous, the next statement is executed before the data is loaded. You've to use the complete callback of load as follow.

$('#div1').load(posts[0] + " .shadow3", function() {
    $('#div1').find('.entry_').prepend('<img id="MsgIcon" src="/email.gif" />');
});

$('#div2').load(posts[1] + " .shadow3", function() {
    $('#div2').find('.entry_').prepend('<img id="MsgIcon" src="/email.gif" />');
});

Upvotes: 1

Related Questions