title: MutationObserver not working
body: <p>Consider the following code: </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver;
  
  var observer = new MutationObserver(function(mutations) {
    mutations.forEach(function(mutation) {
      console.log(mutation.target.nodeName);
    });
  });
  
  observer.observe(document, {
    attributes: true,
    childList: true,
    characterData: true
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div&gt;
    &lt;ol contenteditable oninput=""&gt;
      &lt;li&gt;Press enter&lt;/li&gt;
    &lt;/ol&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>which is a slight modification of <a href="https://hacks.mozilla.org/2012/05/dom-mutationobserver-reacting-to-dom-changes-without-killing-browser-performance/" rel="noreferrer">this</a>. </p>
  
  <p>Interacting with the <a href="http://jsbin.com/hivivaboxa/1/edit?html,js,console,output" rel="noreferrer">jsbin version</a> page does not produce any log. Where am I wrong? Notice that if I substitute line </p>
  
  <pre><code>  observer.observe(document, {
  </code></pre>
  
  <p>with</p>
  
  <pre><code>  observer.observe(document.querySelector('ol'), {
  </code></pre>
  
  <p>the script turns on working...</p>