Змініть значок маркера при натисканні за допомогою листівки

У мене є карта з багатьма (> 100) маркерами на ній. Я хотів би зробити так, щоб натискання на ці зміни змінило значок на виділену версію. Я створив дві власні піктограми, одну звичайну та одну виділену. Я змусив це працювати з одним маркером, але не можу знайти жодного способу його встановити, щоб кожну піктограму можна змінити, натиснувши на неї.

Ось робочий код для однієї піктограми:

var testmarker = L.marker([44.0, -73.0], {icon: unselectedIcon});

testmarker.on('click', function(e) {
  testmarker.setIcon(selectedIcon);
});

Однак у мене є багато маркерів і для розміщення їх використовую цикл:

//points is a 2 dim array with lat/long pairs
for (i = 0; i <= points.length-1; i++) {
    var marker = L.marker([points[i][0], points[i][1]], {icon: unselectedIcon});    
}

marker.on('click', function(e) {
  marker.setIcon(selectedIcon);
});

Я спробував надати кожному маркеру унікальне ім’я змінної за допомогою масиву:

for (i = 0; i <= points.length-1; i++) {
    testmarker[i] = L.marker([points[i][0], points[i][1]], {icon: unselectedIcon}); 
    testmarker[i].on('click', function(e) {
alert(e.latlng); e.setIcon(selectedIcon); 
}); 
}

Що просто дає мені "невизначеного" в попередженні.

Зміна testmarker[i].onв this.map.onтільки дає попередження про натисканні на карті (без змін значка).

Змінивши весь цей рядок на:

testmarker[i].on('click', function(e) {
alert(e.latlng); testmarker[i].setIcon(selectedIcon);
});

Змінює останню (коли натискається будь-яка), одночасно подаючи невизначене попередження.

Як я можу встановити маркери так, щоб кожен міг змінюватися окремо одним клацанням, але не використовуючи сотні повторних блоків коду для кожного?

Я врешті-решт вирішив це. Я також зрозумів, що ви можете додати довільні варіанти та отримати доступ до них пізніше. Це корисно для призначення унікальних ідентифікаторів маркерам:

for (i = 0; i <= points.length-1; i++) {
    testmarker[i] = L.marker([points[i][0], points[i][1]], {icon: unselectedIcon, id: i}); 
    testmarker[i].on('click', function(e) {
        e.target.setIcon(selectedIcon);
        document.getElementById('someDiv').innerHTML = points[e.target.options.id][2];
}); 
}