Desafio: DOM - Evento click

Criei duas funçoes, usei forEach para percorrer, cada elemento do botão para adicionar e remover a class active:

const tag = (element) => { const tagElement = document.querySelector(element);

return tagElement; }

const buttons = document.querySelectorAll('.app__card-button');

function handleClick (target, tag, data) { target.addEventListener('click', () => { tag.setAttribute('data-contexto', data); buttons.forEach((item) => { if ( item === target ) { item.classList.add('active'); } else { item.classList.remove('active'); } }); }); }

const html = tag('html'); const foco = tag('.app__card-button--foco'); const curt = tag('.app__card-button--curto'); const long = tag('.app__card-button--longo')

handleClick(foco, html, 'foco');

handleClick(curt, html, 'descanso-curto');

handleClick(long, html, 'descanso-longo');