how to implement different eventlistener for each row in my table generated through javascript
<p>My javascript code pulls out data from a xml file and prepares a data grid using that data. For each row of my table, i want to set the eventlistener property to open a file whose name is actually the "pid" field which is in that row. 
The code is below:</p>

<pre><code>//Some code to get the xml file
var x = [];
      xmlhttp=new XMLHttpRequest();

    xmlhttp.open("GET","newdata.xml",false);
    xmlhttp.send();
    xmlDoc=xmlhttp.responseXML;

//Now creating each row from the data which i have pushed into array x

    var file_pid = "";
    for (i=0;i&lt;x.length;i++)
      {
var file_pid = "papers/" + x[i].getElementsByTagName("pid")[0].childNodes[0].nodeValue + ".pdf";

//create each row and corresponding attributes
      tr = document.createElement('tr');
      tr.addEventListener('click',function() {window.open(file_pid)},false);
</code></pre>

<p>Now the problem is that the event listener is added but each row opens 1 file, 8.pdf, which is the last record in the xml file. What should i do to make it open only the file name assigned to that perticular row??</p>
