title: Mutation Observer - addedNodes[0] is a comment
body: <p>I am trying to <code>console.log(mutation.addedNodes[0]);</code> which returns <code>&lt;!----&gt;</code>.
  Any idea why is it happening? I am listening to an element called <code>ul.chat-lines</code> on <code>www.twitch.tv/lirik/chat</code></p>
  
  <p>Note: it's an ember application.</p>
  
  <p>This is an if statement that should parse incoming chatlines.</p>
  
  <p><code>chatline = 'chat-line';</code></p>
  
  <p><code>if(mutation.addedNodes.length &amp;&amp; mutation.addedNodes[0].classList.contains(chatline)){</code></p>
  
  <p>Returns: <code>Cannot read property 'contains' of undefined</code></p>
  
  <p>So i placed <code>console.log(mutation.addedNodes[0]);</code> right after </p>
  
  <p><code>mutations.forEach(function (mutation) {
  console.log(mutation.addedNodes[0]);</code></p>
  
  <p>Which like i said, returns <code>&lt;!----&gt;</code>.</p>
  
  <pre><code>var observerConfig = {        
      childList: true,
  };
  </code></pre>
  
  <p>Example chatline from <code>ul.chat-lines</code></p>
  
  <pre><code>&lt;li id="ember1645" class="message-line chat-line ember-view"&gt;&lt;!----&gt;  &lt;div&gt;
      &lt;span class="timestamp float-left"&gt;6:24&lt;/span&gt;
  &lt;!----&gt;&lt;!----&gt;    &lt;span class="badges float-left"&gt;
  &lt;!----&gt;    &lt;/span&gt;
      &lt;span style="color:#FF0000" class="from" data-ember-action="" data-ember-action-1646="1646"&gt;getsomelight&lt;/span&gt;&lt;span class="colon"&gt;:&lt;/span&gt;
          &lt;span style="" class="message"&gt;
                No stream today?
                      &lt;/span&gt;
  &lt;!----&gt;&lt;!----&gt;  &lt;/div&gt;&lt;!----&gt;&lt;/li&gt;
  </code></pre>