`https://codepen.io/Colonn/pen/OJwryLx` ссылка на кодипен с примером.
существует несколько карточек в которых есть кнопки с одним class="podcasts-img", по клику на див должна меняться одна картинка на другую, в одном месте.
Когда кнопка одна то нет проблем. Когда кнопок много нужна работа с массивом данных и здесь у меня не получается.
Вы забыли передать аргумент в forEach. И уже на конкретный item
необходимо вешать слушатель. А в самом слушателе не надо перебирать все элементы с классом, если вы хотите менять только в данной кнопке. Вы можете обратиться к картинке именно этой кнопки через this
const img = document.querySelectorAll('.podcasts-img')
img.forEach(function (item) {
item.addEventListener("click", function() {
this.querySelector('.podcasts-pause').classList.toggle("svg-pause-active")
this.querySelector('.podcasts-play').classList.toggle("svg-play-false")
})
})
P.S. Если очень захотеть, можно только один класс у родителя "тоглить", чтобы картинка менялась. P.P.S. А если очень очень захотеть, то можно через "делегирование событий" сделать, особенно если элементы будут динамические.