title: Remove event listener in JavaScript
body: <p>I add an event listener to an element:</p>
  
  <pre><code>/* sitepoint.com/javascript-this-event-handlers */
  function AttachEvent(element, type, handler){
      if (element.addEventListener){
          element.addEventListener(type, handler, false);
      }else{
          element.attachEvent("on"+type, handler);
      }
  }
  
  window.addEventListener("load", function() {
      var els = getElementsByClassName('name', 'img');
      var elsnum = els.length;
      if(elsnum) //found
      {
          var i = 0;
          for(i=0; i &lt; elsnum; i++)
          {
              var the_els = els[i];
              AttachEvent(the_els, "click", myfunction); 
          }
      }
  }, false);
  </code></pre>
  
  <p>Later in <code>myfunction</code>, I want to remove the handler again, to prevent duplicate clicks:</p>
  
  <pre><code>function myfunction(e) {
      e = e || window.event;
      var target = e.target || e.srcElement;  
  
      //more code
      //...
  
      //remove click handler
      target.removeEventListener('click', e, false);
  
      //more code
      //...
  }
  </code></pre>
  
  <p>The event listener is not being removed, though. When I click on one of the elements, the code of <code>myfunction</code> is executed again. How can I remove the event listener to prevent the clicked element from being clicked again?</p>
  
  <p>PS: I do not use jQuery.</p>