dynamic html buttons in javascript code
<p>so im using javascript, jqeury, and html here. basically i have a dynamic number of buttons that are being created, and will each call a function using unique variables. the variables are held in a json variable. here is the code as it is:</p>

<pre><code>    var box = "&lt;font size=\"2\"&gt;The following assassins are in your current location:&lt;br/&gt;&lt;table width = \"100%\"&gt;";

    for (var i=0; i&lt;info.length; i++) {
        if(userid != info[i].playerid){
            box += "&lt;tr&gt;&lt;td&gt;"+info[i].name+" | rank: "+info[i].rank+"&lt;/td&gt;&lt;td align=\"right\"&gt;&lt;input id='attack' type='button' onclick='loadAttack(userid, info[i].playerid, info[i].name, info[i].rank, location)' value='Attack'/&gt;&lt;/td&gt;&lt;/tr&gt;";
        }    
    }
    box += "&lt;/table&gt;&lt;/font&gt;";

    $("#assassinBox").html(box);        
</code></pre>

<p>the box looks fine, with the proper names, ranks, and buttons. the problem is when a button is pushed, info is undefined. i think this is because the button doesnt get its own copy of i, and i is out of the bounds of the array at the end of the loop. im struggling to think of a solution, some way of passing the onclick function a unique variable?</p>

<p>thanks!</p>
