Делегирование в cloneNode, как реализовать?

Question

[Юрий Иванов]

Я сегодня уже задавал схожий вопрос, но потратив уйму времени так с ним и не справился, выручите, хабр, пожалуйста.
Есть секция, на секцию добавлены различные слушатели
По клику я удаляю секцию section.remove()
Потом по-другому клику я хочу её создавать заново, делаю const a = section.cloneNode(true);
hero.prepend(a);
все работает замечательно, но на клоне не работают слушатели, как это поправить

const startGame = document.querySelector('.game-field__startgame');
document.addEventListener('click', (event) => {
    if(event.target.classList.contains('game-field__startgame')) {
      startGame.style.display = 'none';
    }
});

я дошел до такого кода, когда у меня обработчик событий работает, но все равно не работает на клоне, я пробовал еще вариант с closest, такая же история, помогите в какую сторону воевать

Answer 1

[Михаил Шведков]

Если коротко, то cloneNode не умеет в делегирование. Если по сути, то можно попробовать так:
1. Создаете обработчики отдельным методом
2. После клонирования просто вешаете обработчики заново.
3. Перед удалением грохаете слушатели

Что-то типа такого:

Собственно, по сути предложение - это разделение event-менеджмента и управления версткой