title: Event listener not working on anchor
body: <p>This may be a very dumb question, but I'm desperate right now. I'm trying to execute a javascript function by clicking on an anchor like this:</p>
  
  <pre><code>&lt;head&gt;
  &lt;script type="text/javascript"&gt;
      function myFunction() {
          alert('It was clicked');
      }
      Anchor.addEventListener('click', myFunction, false);
  &lt;/script&gt;
  &lt;/head&gt;
  …
  &lt;a href="#" id="Anchor"&gt;Click me&lt;/a&gt;
  </code></pre>
  
  <p>But it's not working.</p>
  
  <p>However, this works fine:</p>
  
  <pre><code>&lt;a href="javascript:myFunction()" id="Anchor"&gt;Click me&lt;/a&gt;
  </code></pre>
  
  <p>And even this does:</p>
  
  <pre><code>&lt;a href="#" onclick="myFunction()" id="Anchor"&gt;Click me&lt;/a&gt;
  </code></pre>
  
  <p>What is the correct way to go? What am I doing wrong? A <a href="http://jsfiddle.net/arielnmz/9L4xbsjx/" rel="nofollow">jsfiddle for example here</a>.</p>
  
  <p>Extra info:</p>
  
  <p>I have set up other events using the same method, but somehow the anchor is the only one that doesn't work. Example:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      function aFunction() {
          AnElement.style.display = 'none';
      }
      window.addEventListener('load', aFunction, false);
  &lt;/script&gt;
  </code></pre>
  
  <p>And the element is hidden perfectly fine when the window has finished loading.</p>