How to add onclick dynamically in Jquery? <p>I have the following code:</p> <pre><code> obj2 = JSON.parse(ajax.responseText); for (var i = 0; i &lt;= obj2.length - 1; i++) { var row = table.insertRow(1); var cell1 = row.insertCell(0); var cell2 = row.insertCell(1); var cell3 = row.insertCell(2); var cell4 = row.insertCell(3); var cell5 = row.insertCell(4); var cell6 = row.insertCell(5); var cell7 = row.insertCell(6); var cell8 = row.insertCell(7); cell1.innerHTML = obj2[i].qid; cell2.innerHTML = obj2[i].question; cell3.innerHTML = obj2[i].answer1; cell4.innerHTML = obj2[i].answer2; cell5.innerHTML = obj2[i].answer3; cell6.innerHTML = obj2[i].answer4; $(function(){ var btn = document.createElement("BUTTON"); var t = document.createTextNode("Delete "+cell1.innerHTML); //this works well btn.appendChild(t); btn.className="menu_buttons"; $(btn).on('click' ,function(){ delete_(cell1.innerHTML);//this assigns the value of the last iteration to each button }); cell8.appendChild(btn); }); } </code></pre> <p>I'm iterating over a json array and I want to assign the same function (with different parameter, depending on an id from the array) to each button, and as I mentioned in the comment, it overwrites each button with the same parameter. What's wrong?</p>