title: Javascript - loop is making onclick event happen without the "click"
body: <p>So I have this piece of code:</p>
  
  <pre><code>window.onload = function () {make_buttons ('calc'); }
  
  function make_buttons (id) {
      var input = document.createElement("input");
      input.type = 'text';
      input.id = 'inp';
      document.getElementById(id).appendChild(input);
      for (var i = 0;i &lt; 10; i++){
          var btn = document.createElement ("button");
          btn.id = i;
          var txt = document.createTextNode (i);
          btn.appendChild(txt);
          var make_btn = document.getElementById(id).appendChild(btn);
          make_btn.onclick = document.getElementById("inp").value += i;
      }
  };
  </code></pre>
  
  <p>So when I load the page, all the numbers from 1 to 9 are printed into my text field.  But adding a number in the text field should only happen when I click it because of the onclick thing. </p>
  
  <p>How can I overcome this issue?</p>