Как сделать элементы списка доступными после добавления?

Question

(я буду стараться держать этот вопрос просто на данный момент, так как я не знаю, как идти об этом.)

Я должен изменить неупорядоченный список элементов внутри HTML-файла,

1 .) Создайте фрагмент DOM (для каждого из новых <li>) в javascript.

2.) Удалить оригинальную партию <li> в ul.

3.) Добавление каждого нового фрагмента DOM в ул

4.) Сделайте каждый из новых элементов <li> кликабельны снова

При нажатии на <li> элемент удаляет содержимое мкл и заменяет его новая партия (партия колеблется от 0 до 6 <li><li> элементов (в зависимости от того, какого элемента вы щелкнули))

Первая проблема у меня в том, что нет никакого способа, чтобы создать несколько элементов интерактивных в один ход (для циклов не работает), так что в настоящий момент я просто повторяю функции, которые у меня есть.

$("#choices").children().eq(0).click(function() { 
     selectChoice(allChoices, $("#choices").children().eq(0).text()); 
    }); 

    $("#choices").children().eq(1).click(function() { 
     selectChoice(allChoices, $("#choices").children().eq(1).text()); 
    }); 
    // more li elements to make clickable 

Во-вторых, при удалении элемента LI и положить обратно новый элемент, вы должны сделать его интерактивными, но так как вы не знаете, количество элементов и петель не работают, я не могу добавить функции при создании. Не все элементы также соответствуют тому же формату, поэтому простое изменение существующего li не является опцией.

Есть ли простой способ, которым я не знаю, что делает то, что я хочу, чтобы он сделал ..?

Answer 1

Вы используете jQuery, не так ли?

Посмотрите на метод on. Вы должны быть в состоянии сделать что-то вроде

$('#choices').on('click', 'li', function(ev) { 
    ... do your thing ... 
}); 

По мере появления новых li «s добавляют при #choices, это событие связывания автоматически будет добавлен к новой li. http://api.jquery.com/on/