title: Code works on site, but not on codepen/jsfiddle
body: <p>The following js code works as expected on my localhost, but not on codepen/jsfiddle.</p>
  
  <p>Here is the <a href="https://codepen.io/anon/pen/jGYMLB" rel="nofollow noreferrer">codepen</a>.
  Code is supposed to show drop down menu on menu icon click. And hide it on close button click.</p>
  
  <p><strong>JS</strong></p>
  
  <pre><code>/** menu drop down */
  document.addEventListener('DOMContentLoaded', function() {
      cntrls = document.querySelectorAll('.menu.dropdown a, span[class$="menu-pop-up-closer"]');
      [].forEach.call(cntrls, function(e) {
          e.addEventListener('click', function(t) {
              t.preventDefault();
              this.classList.toggle("open");
              document.getElementById("menu-pop-up").classList.toggle("open");
              return false;
          },  false);
      });
  });
  </code></pre>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div class="pageBox"&gt;
      &lt;header&gt;
          &lt;div class="menu-wrapper"&gt;
              &lt;dl id="menu"&gt;
                  &lt;dt class="menu dropdown"&gt;&lt;a href=""&gt;Lore&lt;/a&gt;&lt;/dt&gt;
                  &lt;dd class="menu-box"&gt;
                  &lt;/dd&gt;
                  &lt;dt class="home-url"&gt;
                  &lt;a href="http://increpo.serveo.net/"&gt;Lorem ipsum dolor sit &lt;/a&gt;
                  &lt;a class="call-us" href="tel:+1(999)999-999"&gt;&lt;img width="23" alt="Lorem ipsum dolor sit " src="http://increpo.serveo.net/skin/frontend/rwd/mobile/images/header-phone.png"&gt;&lt;/a&gt;
              &lt;/dt&gt;
                  &lt;dd&gt;&lt;/dd&gt;
              &lt;/dl&gt;
          &lt;/div&gt;
      &lt;/header&gt;
      &lt;div id="menu-pop-up"&gt;
          &lt;div class="menu-pop-up-closer-hldr"&gt;
              &lt;span class="menu-pop-up-closer"&gt;&amp;#10005;&lt;/span&gt;
          &lt;/div&gt;
          &lt;div class="menu-pop-up-list"&gt;
              &lt;ul&gt;
                  &lt;li class="menu-pop-up-home-li"&gt;&lt;a href="#" title="Lore"&gt;Lore&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li&gt;
                      &lt;ul&gt;
                          &lt;li&gt;&lt;a href="#" title="Lorem"&gt;Lorem&lt;/a&gt;
                          &lt;/li&gt;
                          &lt;li&gt;&lt;a href="#" title="Lorem "&gt;Lorem &lt;/a&gt;
                          &lt;/li&gt;
                          &lt;li&gt;&lt;a href="#" title="Lorem "&gt;Lorem &lt;/a&gt;
                          &lt;/li&gt;
                          &lt;li&gt;&lt;a href="#" title="FAQ"&gt;FAQ&lt;/a&gt;
                          &lt;/li&gt;
                          &lt;li&gt;&lt;a href="#" title="Lorem ipsum dolo"&gt;Lorem ipsum dolo&lt;/a&gt;
                          &lt;/li&gt;
                      &lt;/ul&gt;
                  &lt;/li&gt;
                  &lt;li&gt;&lt;a href="#" title="Lore"&gt;Lore&lt;/a&gt;
                  &lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>"Code is supposed to show drop down menu on menu icon click. And hide it on close button click."  </p>