Как сделать делегирование на перебор элементов?

Question

[gazes12]

Доброе утро!

let fio = $('.recall__people-fio');
fio.each(function(){
    $(this).on('click', function(){
        $(this).toggleClass('elipsise');
    });
});

Код вышел не будет работать на элементы которые будут добавлены через javascript (эти элементы называют динамическими). Как правильнее реализовать данную идею?
.

Comments

[RAX7]

https://api.jquery.com/on/#direct-and-delegated-events

[RAX7]

$(document).on("click", ".recall__people-fio", function () {
  $(this).toggleClass("elipsise");
});

[gazes12]

RAX7, Спасибо!

Answer 1

[Кирилл]

сократите код до:

$('.recall__people-fio').on('click', function(){
  $(this).toggleClass('elipsise');
});

после чего всё должно заработать само, а назначением обработчиков через перебор коллекции вы ограничиваете их срабатывание только на тех элементах, которые существовали в DOM на момент начала перебора

Comments

[gazes12]

Кирилл, Не работает на элементы, которые были добавлены через js. Только после обновления страницы работает.

[Кирилл]

gazes12, да, вам в комментарии к основному вопросу уже написали более корректный ответ