Search code examples
javascripthtmldommutation-observers

Is it possible to modify dynamically added DOM nodes?

I have some javascript libraries (for example Adobe Edge), which dynamically insert script nodes into DOM. I detect changes with MutationsObserver, is it possible to modify the mutated nodes?

Solution

  • Yes you can modify nodes that are added to the DOM dynamically just like you can any other node.

    var target = document.querySelector('div');

new MutationObserver(function(mutations) {
    mutations.forEach(function (mutation) {
        Array.prototype.forEach.call(mutation.addedNodes, function (node) {
            node.style.backgroundColor = 'red';
        });
    });
}).observe(document.querySelector('div'), {attributes: true, childList: true, characterData: true});

target.appendChild(document.createElement('span'));

    http://jsfiddle.net/ExplosionPIlls/rK6Hr/