Mutation Observer does not work

Question

jsFiddle

The script above does not work properly. I wanted to replace DOMNodeInserted(Line19) to MutationObserver(line21), but when I used MutationObserver, it does not work.

// Line 19 (works well)
document.body.addEventListener('DOMNodeInserted', function (event) {linkifyContainer(event.target);}, false);

// Line 21 (does not work)
var observer=new window.MutationObserver(function(mutations){mutations.forEach(function(mutation){linkifyContainer(mutation.addedNodes)})});observer.observe(document.body,{childList:true,subtree:true});

There should be something wrong in line 21, but I don't know what the problem is and what I should do.
I checked this with chrome28 and firefox23.
It's an extension of chrome, so I don't have to use "WebKitMutationObserver" or "MozMutationObserver".

Please tell me the solusion.

Answer 1

Your mutation observer code works fine. You are trying to pass linkifyContainer a NodeList argument (namely, mutation.addedNodes), but linkifyContainer expects to be passed a single element.

Compare the calls:

linkifyContainer(event.target)

and

linkifyContainer(mutation.addedNodes)

The second case is a NodeList, not a single DOM node, as indicated by the plural property name addedNodes.

Simply use mutation.addedNodes[0], or a loop over mutation.addedNodes:

for(var i=0; i<mutation.addedNodes; ++i) {
    linkifyContainer(mutation.addedNodes[i]);
}