Running jQuery after all other JS has executed

Question

In the past, I have used $(window).onload to run a block of code after other scripts have loaded. In this case I don't have the ability to change the loading order of the JS files and the code that I am concerned with needs to manipulate DOM nodes that are dynamically inserted by another JS file that is loaded further down the page. Both scripts are located near the bottom of the document. Does anyone have any suggestions for this scenario?

Answer 1

If you know what elements to expect, you can use setInterval to poll the DOM to see when they've been inserted. For example, this is how you could poll for an element with ID foo:

$(window).load(function ()
{
    var i = setInterval(function ()
    {
        if ($('#foo').length)
        {
            clearInterval(i);
            // safe to execute your code here
        }
    }, 100);
});