Question

I am currently making use of Simon Willson’s addLoadEvent function to add functions that I want to run after the load event. I ran into a problem wherein the the function I passed to the addLoadEvent function referenced a div that had not yet been loaded by the DOM and so my action (showing the div) did not do anything. When I changed to using the jQuery $(document).ready function, the div has been loaded by the DOM and I can execute actions with it (make it show up).

So, a couple questions. Why is my function being executed before the DOM has completed loaded using the above function? Is there a way to delay it? The other alternative that I can think of is passing in a function to a jquery equivalent:

function jqueryAddReadyEvent(myFunc)
{ 
    $(document).ready(function()
    {
        //execute already existing functions
        //add a new function to the ready event
        myFunc();
    }
}

When I try the above code, I get a javascript error “myFunc is not a function”. Is there a way to generically pass in a function to the jquery ready function and have it execute? Equivalent to the following:

$(document).ready(function()
{
    funcA();
}
$(document).ready(function()
{
    funcB();
}
...//more of the same

Replaced with the following:

jQueryAddReadyEvent(funcA);
jQueryAddReadyEvent(funcB);

Answer 1

You can just do:

$(document).ready(myFunc);

to attach functions to the DOM ready event. Here’s the fiddle: http://jsfiddle.net/padtE/