title: Onclick vs addEventListener
body: <p></p>
  
  <p>I'm little confusing by using "onclick" "onmousedown" as a property of HTML elements.</p>
  
  <p>Such as:</p>
  
  <pre><code>&lt;button onclick="my_JS_function()"&gt;&lt;/button&gt;
  </code></pre>
  
  <p>or</p>
  
  <pre><code>&lt;div onmousedown="my_another_JS_funciton"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>But some people tell that only "proper" way of adding "listeners" are by</p>
  
  <pre><code>document.getElementById("my_id").addEventListener("onclick", my_JS_function, false);
  </code></pre>
  
  <p>What is the more "proper" more supported way of doing that?</p>