How do I monitor the DOM for changes?

Question

Is there a way - using jQuery or otherwise - to monitor the DOM for insertions, deletions, updates to styles, etc?

Answer 1

This is only for debugging purposes:

Firebug currently allows setting breakpoints on html nodes.

You have to open the html inspector, right click on a node and you have the following options:

• Interrupt on attribute change
• Interrupt on child add/remove
• Interrupt on remove

Once you reach the breakpoint you can also browse the call stack.

Google Chrome has a similar feature too.