JSFiddle - React, Tailwind, and code Playground

HTML

<button id="btn1" onclick="ocultaDiv1()">Boton 1</button>
<button id="btn2" onclick="ocultaDiv2()">Boton 2</button>

<div id="panel1" class="panel1">
    <input type="button" value="Hola" onclick="animation('Hola')" />

    <input type="button" value="Adios" onclick="animation('Adios')" />

    <input type="button" value="Pa" onclick="animation('Pa')" />

    <input type="button" value="Ma" onclick="animation('Ma')" />
</div>

<div id="panel2" class="panel2">
    <input type="button" value="Hola" onclick="animation('Hola')" />

    <input type="button" value="Adios" onclick="animation('Adios')" />

    <input type="button" value="Pa" onclick="animation('Pa')" />

    <input type="button" value="Ma" onclick="animation('Ma')" />
</div>

CSS

.panel1 {
background-color: grey;
height: 50px;
padding: 10px;    
}
.panel2 {
background-color: green;
height: 50px;
padding: 10px;    
}

JavaScript

function ocultaDiv1() {    
    document.getElementById("panel1").style.display = "none";   
}

function ocultaDiv2() {    
    document.getElementById("panel2").style.display = "none";   
}