title: How to use Javascript for loop to create buttons and call an on click function
body: <p>I have been able to create the buttons using the for loop, but on click on a button, it picks the last value in the list of arrays, Why?</p>
  <pre><code>//list of propertySidebarItem styles to use to create the buttons
  for (var i = 0; i &lt; propertySidebarItem.styles.length; i++) {
    //current property style to use
    var style = propertySidebarItem.styles[i];
    //create the button using the current style
    var btnElement = document.createElement('button');
    btnElement.className = 'btn ' + element.tagName + style.name;
    //on click of any button, display the button properties
    btnElement.onclick = function () {
      //at this stage i am getting the last value in the propertySidebarItem.styles array
      console.log(btnElement);
    };
  }
  </code></pre>