Is is possible to determine when an element has been rendered using JavaScript?

elementReady: a jQuery plugin

Update in 2018, You can use new MutationObserver API for this, here is a plugin just for that:

(function($, ready) {
    $.fn.ready = function(callback) {
        var self = this;
        callback = callback.bind(self);
        if (self[0] == document) { // it will return false on document
            ready.call(self, callback);
        } else if (self.length) {
            console.log('length');
            callback();
        } else  {
            if (!self.data('ready_callbacks')) {
                var callbacks = $.Callbacks();
                callbacks.add(callback);
                var observer = new MutationObserver(function(mutations) {
                    var $element = $(self.selector);
                    if ($element.length) {
                        callbacks.fireWith($element);
                        observer.disconnect();
                        self.removeData('ready_callbacks');
                    }
                });
                observer.observe(document.body, {
                  childList: true,
                  subtree: true
                });
            } else {
                self.data('ready_callbacks').add(callback);
            }
        }
        return self;
    };
})(jQuery, jQuery.fn.ready);

the limitation is that it only work for base use of jQuery with string as CSS selector.

If you don't need the same name as build in ready you can use different name and remove ready.call(self, callback);.

you can easily track on load for any element in the web page.

$(function(){$("#ele_id").bind("load", function () { alert('hurray!') });})

for more details see this thread : jQuery How do you get an image to fade in on load?