Jquery click a href link inside for loop

I have assigned a variable with arrays inside array i.e.

var encounter_names = new Array();
encounters.encountersDB.each(function(encounter) { encounter_names.push(new Array(encounter.key, encounter.name))})

this is my for loop statement mentioned as below

for (var i = 0; i < encounter_names.length; i++) {
    window['li' + i] = $("li[key='" + encounter_names[i][0] + "']")
    window['li' + i] = $("<li key='" + encounter_names[i][0] + "' class='list'><a class='arr开发者_开发百科ow_'+ encounter_names[i][0] +'" + encounter_names[i][0] + "' href='#'>" + encounter_names[i][1] + "</a></li>")
    $('.arrow_' + encounter_names[i][0] + '').click(function (event) {
        encounters.show(window['key' + i]);
        event.preventDefault();
    })
    encounters_list.append(encounter_names[i][0])
}

When I click an href link I am get the following error in console log:

TypeError: Result of expression 'encounter_names[i]' [undefined] is not an object.

Any suggestions are always welcomed.

I think encounters.encountersDB is an object, not a html object?
The problem is this: The each function gets two arguments: the current index and the element. So you just have to change this to:

var encounter_names = []; // short form for new Array()
$.each(encounters.encountersDB, function(index, encounter) {
  encounter_names.push([encounter.key, encounter.name]);
})