Надо получить значения изменяющихся h2 и по кличке на кнопку возле каждого из них вставлять это значение в h1

Надо найти значения текста h2 и заменить им существующий h1. Значение текста h2 меняется каждые 10 секунд. Как это сделать, не создавая дополнительные классы для каждого из элементов? В блоке каждого див h2 есть кнопка для замены.

Ее надо привязать чтобы при клике по ней заменялся соответствующий h2. У меня почему то получается находить и заменять только 1 элемент , остальные не находятся )


Ответы (1 шт):

Автор решения: Andrei

Можно сделать вот так:

const wrap = document.getElementsByClassName('wrapper');

for (item of wrap) {
  item.children[2].addEventListener('click', e => {
    e.target.parentElement.children[0].textContent = e.target.parentElement.children[1].textContent;
  });

}
<div class="wrapper">
  <h1>A'm H1</h1>
  <h2>Изменяющийся текст</h2>
  <button>Replace</button>
</div>
<div class="wrapper">
  <h1>A'm H1</h1>
  <h2>Изменяющийся текст</h2>
  <button>Replace</button>
</div>
<div class="wrapper">
  <h1>A'm H1</h1>
  <h2>Изменяющийся текст</h2>
  <button>Replace</button>
</div>

→ Ссылка