Sugiro você sempre estar buscando meios diferentes para ter a solução, apenas com o data não consegui, mas achei algo muito interessante no site stack over flow, uma forma de alterar o CSS com o Js puro, atingindo diretamente o display da tag(div,li,h1,header...), e consister no código abaixo:
O primeiro passo que dei foi criar uma classe no HTML para o botão clicavel "Aluratintas em estoque" ficando assim:
//HTML
<button class="botao" onclick="mostraTintas(this)">Aluratintas em estoque:</button>
E aqui vai o código para buscar essa classe + a alteração do display dela no CSS através do Js.
//JS
const botao = document.querySelector(".botao");
let click = botao.addEventListener("click", (mostraTintas) => {
let displayLista = document.querySelector(".lista").style.display
if (displayLista === 'none') {
document.querySelector(".lista").style.display = "block"
}
else {
document.querySelector(".lista").style.display = "none"
}
});
Comecei bem perdido com Js por conta do tdah que dificulta meu entendimento, mas depois de rever 5x(Sim foram 5 vezes kkkkk) as aulas passadas conseguir começar a pegar o embalo da coisa, nunca desistam as vezes precisamos entender 1 coisa para que tudo fique mais claro.