Почему не работает .click()?

Question

[teertsneerg]

Всем привет! Возникла такая проблема:

Использую такой код:

$(".answer-item").click(function() {
  $(this).toggleClass("active");
});

И всё работает прекрасно с элементами, которые изначально прописаны в html файле.

Если создать список элементов таким образом:

answers.forEach(function(item) {
  $('#answers').append('<p class="answer-item">'+item+'</p>');
});

То код перестаёт работать. Есть идеи почему так может происходить? (Перед созданием элементов выполняется ajax запрос, может ли быть это из-за него? Консоль никаких ошибок не выдаёт, просто 0 реакции на клики).

Comments

[0xD34F]

Есть идеи почему так может происходить?

Нет блин, вообще без понятия. Вы же первый на этой планете, у кого такая проблема возникла. Ни у кого раньше не случалось, а вот у вас - вдруг такой облом. Правильно сделали, что не стали гуглить - бесполезно.

Answer 1

[Пашенька]

А вы то сами как думаете, почему? Вы ставите обработчик на элементы, потом добавляете новые элементы, а обработчика на них нет, никто же его не ставил, верно? Нужно использовать делегирование:

$(document).on('click', '.answer-item', function() {
  $(this).toggleClass("active");
});

Answer 2

[Dymok]

$('body').on('click', '.answer-item', function() {
  $(this).toggleClass("active");
});