Similar to the way jQuery loads after the document has loaded I need a certain bit of jQuery after a JavaScript script has FINISHED.

I am loading contact data from Google Data API and the div where the data shows up needs to be pletely loaded (by the JavaScript) to be accessible by the jQuery if I'm right.

Is there any way to do this?

Similar to the way jQuery loads after the document has loaded I need a certain bit of jQuery after a JavaScript script has FINISHED.

I am loading contact data from Google Data API and the div where the data shows up needs to be pletely loaded (by the JavaScript) to be accessible by the jQuery if I'm right.

Is there any way to do this?

• javascript
• jquery
• jquery-events

• after javascript has finished doing what? and what are you trying to do exactly? – Victor Commented Feb 2, 2011 at 23:48
• What exactly do you mean by, "after a JavaScript script has finished"? Do you mean, after some particular JavaScript function call has returned? – Pointy Commented Feb 2, 2011 at 23:48
• One thing that's confusing things for me is that the term, "a JavaScript" doesn't necessarily make a lot of sense; it's essentially the same as, "a Python" or "a PHP" or "a Ruby". JavaScript is a programming language, so while it's easy to imagine what someone might mean by using the term "a JavaScript", it's hard to know exactly what's right because the term is essentially meaningless. – Pointy Commented Feb 2, 2011 at 23:50
• I am loading contact data from Google Data API and the div where the data shows up needs to be pletely loaded (by the javascript) to be accessible by the jQuery if im right. – nkcmr Commented Feb 2, 2011 at 23:50

4 Answers 4

Let's say you're waiting for Google Analytics to load. Now, you know that when Google Analytics loads, _gaq will be registered on the DOM. So, barring all other (better) asynchronous options, you can create a function that waits for the existence of _gaq:

waitForGaq = function(fn, attemptsLeft) {
    var tick = attemptsLeft || 30; 

    if (typeof(_gaq) != 'object' || !_gaq._getAsyncTracker) {
        //_gaq isn't registered yet
        if (tick > 1) {
            //recurse
            setTimeout(function() {
                waitForGaq(fn, tick - 1);
            }, 100)
        }
        else {
            //no ticks left, log error
            log('failed to load window.gaq');
        }
    }
    else {
        //gaq is loaded, fire fn
        fn();
    }
}

So, any code needs to run AFTER _gaq is registered, you can add to the page thusly:

waitForGaq(function() {
    //here's all my code...
});

To reiterate: recursing like this is only necessary if the script that you're adding doesn't offer an asynchronous way of interacting with the library. Google Analytics, for one, is kind of a moot example as it offers a cleaner approach:

http://code.google./apis/analytics/docs/tracking/asyncTracking.html

Try head.js

It allows to define exactly when (after specific script or after all of them have been loaded) you want to execute particular piece of code.

Not to mention it is by itself very neat.

inject a tag directly after the original with the jQuery code you need to run

<script src="foo" id="bar">

$("#bar").after(
    $("<script>").text("some code")
);

if i understand correctly, you want to do something like:

<script>
// your javascript code
</script>
<script>
//your jquery code
</script>