Only the last data in my for loop assigns
<p>Hey I have a simple loop like this:</p>

<pre><code>for(var i in nodes) {
    var d = document.createElement('div');
    d.className = 'box';
    d.id = 'node' + i;
    document.getElementById('node').appendChild(d);
    document.getElementById('node'+ i).innerHTML = nodes[i].name;
    document.getElementById('node'+ i).addEventListener('mousedown', function() { 
        var info = nodes[i]; display_parent(info);
    }, false);
}

function display_parent(data){
    console.log(data);
}
</code></pre>

<p>The problem is all the divs hold the same information aka <code>the last one in the loop</code>, i tried to assign the data to a local variable to <code>info</code> but it still does not work.</p>

<p>Any ideas how I can fix that?</p>
