title: Can't understand Javascript eventhandler with for loop code
body: <p>I'm trying to learn JavaScript and I saw a code to change the css style of a web page depending on the button you press. </p>
  
  <p>I can't understand why or how a for loop indicate witch button was press. Here is the javascript part:</p>
  
  <pre><code>var buttons = document.getElementsByTagName("button");
  
  var len = buttons.length;
  
  for (i = 0; i &lt; len; i++) {
    buttons[i].onclick = function() {
      var className = this.innerHTML.toLowerCase();
        document.body.className = className;
    };
  }
  </code></pre>
  
  <p><a href="http://jsfiddle.net/qp9jwwq6/" rel="nofollow">http://jsfiddle.net/qp9jwwq6/</a></p>
  
  <p>I looked on the net and w3 school but they don't explain that code with a for loop. Can someone explain it to me?</p>
  
  <p>Thank you</p>