No HTML, adicionei um data-cor
referente a cor, então na li do laranja, adicionei data-cor="laranja"
, e assim por diante.
logo após, fiz dois botões, Sumir e Voltar
<button data-botao="sumir">Sumir</button>
<button data-botao="voltar">Voltar</button>
e no JS, fiz uma ação de quando clicar no sumir, os dados serão substituidos para " ", e quando clicar no voltar, eles voltarão com o padrão no data-set
const botao = document.querySelectorAll("[data-botao]")
const cores = document.querySelectorAll("[data-cor]")
botao.forEach((element) => {
element.addEventListener("click", (evento) =>{
//console.log(evento.target.dataset.botao)
if (evento.target.dataset.botao == "sumir"){
cores.forEach(cor => {
cor.innerHTML = ""
})
} else {
cores.forEach(cor =>{
//console.log(cores)
cor.innerHTML = "Tinta " + cor.dataset.cor
})
}
})
});