@anton_trofimov95

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

Есть код
const openModals = document.querySelectorAll('.open-modal')
const modalBg = document.querySelector('.modal-bg')

for (openModal of openModals) {
    openModal.onclick = function() {
        modalBg.classList.toggle('modal-bg__active')
    }
}


Открывает по клику на элемент с классом .open-modal модалку. Если в верстке сделать кнопку с этим классом - все работает

Но если я добавляю элемент через js

const uls = document.querySelectorAll('.third-block-flex__item__body ul')
const button = document.createElement('button')

button.className = 'button open-modal'
button.innerText = 'Хочу этот пакет'
for (ul of uls) {
    ul.after(button)
}


То клик уже не работает и добавляется только в одном месте. Как решить данную проблему?
Код
  • Вопрос задан
  • 57 просмотров
Решения вопроса 1
Seasle
@Seasle Куратор тега JavaScript
Помог - отметь решением \( ゚ヮ゚)/
const uls = document.querySelectorAll('.third-block-flex__item__body ul');

for (let ul of uls) {
	const button = Object.assign(document.createElement('button'), {
		className: 'button open-modal',
		textContent: 'Хочу этот пакет'
	});
	button.addEventListener('click', ВАШ_ОБРАБОТЧИК);

	ul.after(button);
}
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
HistoryART
@HistoryART
Молодой и дерзкий
Ваш подход к задаче не правильный, ознакомьтесь с .map() и с forEach

click
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Fundraise Up Санкт-Петербург
от 2 500 до 3 500 $
Admitad Projects Москва
от 130 000 до 200 000 ₽
от 5 000 до 6 500 $
29 мая 2020, в 00:02
5000 руб./за проект
28 мая 2020, в 23:42
10000 руб./за проект