Determining if a HTML element has been added to the DOM dynamically

Question

Is there a way in Javascript or jQuery to find out when a HTML element has been added to the DOM dynamically, either through jQuery.append() or one of the nativ

Answer 1

Based on the technique by Daniel Buchner I have created a small library to catch DOM insertions. It's more comfortable to use than the hack itself.

It uses css animation events, so it's not based on DOMMutationEvents, and it's not Mutation Observer. So it's not slowing down the page and it has a wider support than MutationObserver.

It has an added benefit of being able to use any CSS selectors you want.

Example usage:

insertionQ('.content div').every(function(element){
    //callback on every new div element inside .content
});

If you invoke it after DOMReady, it's going to catch only new elements.

See https://github.com/naugtur/insertionQuery for more options