title: Add event listener in WordPress
body: <p>I'm trying to add an event listener to my WordPress site, but somehow it doesn't work and I have no idea why... I am a new developer with just a little self education, so a simple explanation on what's not working there would be appreciated! </p>
  
  <p>Here is my code and what I'm trying to do: I got 6 equal column with 16.66% width, and I want to change their width when clicking on them, so the clicked column become 50% and the rest 10%:</p>
  
  <pre><code>document.addEventListener("DOMContentLoaded", callIt);
  function callIt() {     
      var x = document.getElementsByClassName('col-1-6');
      for (var j=0; j &lt; x.lenght; j++) {
          x[j].addEventListener = ("click", function(){miniPage(this.Id);});
      }
  }
  var activeTab;
  function miniPage(activeTab) {
      var i, arz;
      arz = document.getElementsByClassName('col-1-6');
      for (i = 0; i &lt; arz.length; i++) {
          arz[i].style.width = "10%";
      }
  document.getElementById(activeTab).style.width = "50%";
  
  }
  </code></pre>