title: Event listener in elements appended after DOM Content Loaded
body: <p>I need to listen a "change" event of a <code>&lt;select&gt;</code> but this works fine only on the first select, there's a button that adds more <code>&lt;select&gt;</code> to the <code>document</code>, so I need to check if any <code>&lt;select&gt;</code> is changed, I'm doing something like this:</p>
  
  <pre><code>document.addEventListener('DOMContentLoaded', function() {
      var selects = document.getElementsByClassName('select');
      for(var i=0;i &lt; selects.length;i++) {
          selects[0].addEventListener('change', function() {
               // do something here...
          }, false);
      }
  }, flase);
  </code></pre>
  
  <p>but this only executes when <code>DOMContentLoaded</code> and if I execute it outside the <code>document.addEventListener</code> it doesn't executes.</p>
  
  <p>P.S. I'm doing this with pure JS cause is the same with <code>jQuery</code> and I've more control over my script with pure JS.</p>