title: What's the difference between live and not live collection in Javascript selectors?
body: <p>How can I know what is the difference between live and not live collection. </p>
  
  <p><em>According to my research:</em> </p>
  
  <p>A <strong>live</strong> is: when the changes in the DOM are reflected in the collection. The content suffers the change when a node is modified. </p>
  
  <p>A <strong>Not Live</strong> is : when any change in the DOM does not affect the content of the collection.  </p>
  
  <p>document.getElementsByClassName() is an HTMLCollection, and is live.</p>
  
  <p>document.getElementsByTagName() is an HTMLCollection, and is live.</p>
  
  <p>document.getElementsByName() is a NodeList and is live.</p>
  
  <p>document.querySelectorAll() is a NodeList and is not live.</p>
  
  <p><strong>Why document.querySelectorAll is not live?</strong></p>
  
  <p><em>I know that :</em> </p>
  
  <p><strong>HTMLCollection</strong> only contains Elements Nodes
  <strong>NodeList</strong> contains Element Nodes and Text Nodes. </p>