Question

This is what I have

var path = $('#sprite').css('background-image').replace('url', '').replace('(', '').replace(')', '').replace('"', '').replace('"', '')
var tempImg = '<img id="tempImg" src="' + path + ' "/>';
$('body').append(tempImg); 
alert($('#tempImg').width());

The result is being 0, but if I go into a console and type $('#tempImg').width(), we get the right width.

So, what it seems is that the append is only “loaded” after the execution of the code, I need to use my code after the item has been appended, is there a way?

Answer 1

Thanks to some comments and answers here I achieved to successfully achieve my goal

    frame_width = $('#sprite').width();

var path = $('#sprite').css('background-image').replace('url', '').replace('(', '').replace(')', '').replace('"', '').replace('"', '')
var tempImg = '<img id="tempImg" src="' + path + ' "/>';
    $('body').append(tempImg); 
    $('#tempImg').load(function(){
        alert($("#tempImg").width());
    });

This worked and alerted the right value
Thank you all