Как реинициализировать события после append в jquery?

Question

[Сергей Шилов]

Привет! Я по клику добавляю и удаляю элементы, а внутри элементов есть еще 2 обработчика событий: инициализация плагина и удаление по клику. Сейчас код выглядит так:

// добавить блок
$('#prof-choise_add').click(function() { // кликаем по кнопке "добавить"
    var profItem = $('#prof-choise_item'); 
    var profItemHtml = profItem.html(); // получаем содержимое добавляемого элемента
   
    $('.prof-wrapper').append(profItemHtml) // добавляем содержимое в блок .prof-wrapper

    profItem.find('#prof-choise_select').select2({ // инициализируем после добавления
        placeholder: "Например продюссер"
    });
});

// удалить блок
$('.prof-choise_remove').click(function() {
    $(this).closest('.prof-choise_item').remove(); 
});

События внутри содержимого элемента profItem не реинициализируются. Гуглил, пока с трудом понимаю суть

Answer 1

[Anton fon Faust]

оформите на jsfiiddle

Comments

[Сергей Шилов]

https://jsfiddle.net/0etp6un7/3/

тут без плагина select2

[Сергей Шилов]

?

[Anton fon Faust]

Сергей Шилов,
вариант номер раз (работающий):
https://jsfiddle.net/um2qxsg7/ - перед тем, как вставляем в dom создаем jquery объект и на него вешаем обработчики событий
вариант номер два (правильный):
https://jsfiddle.net/h06kLofs/ - используем всплытие события click, и определяем по чем был клик (плюсы: меньше обработчиков, меньше вызовов - экономия памяти, быстрее работает, код более компактный, не нужно лишних действий по отслеживанию, когда что добавилось)