JSFiddle - React, Tailwind, and code Playground

by Trotter

HTML

<HTML>
   <HEAD>
       <TITLE>TEST</TITLE>
   </HEAD>
    <BODY>
<div id="table1">
<table>
<tr>
    <td>Ячейка 1</td>
    <td>Ячейка 2</td>
</tr>
<tr>
    <td>Ячейка 3</td>
    <td>Ячейка 4</td>
</tr>
</table>

</div> 

<div id="table2" style="display:none">
<table>
<tr>
    <td>Я 1</td>
    <td>Я 2</td>
</tr>
<tr>
    <td>Я 3</td>
    <td>Я 4</td>
</tr>
</table>
</div>

<div id = "show1t" style="display:none">
<input type="BUTTON" value="show1t" onclick="hiden_button();"/>
</div>

<div id = "show2t">
<input type="BUTTON" value="show2t" onclick="hiden_button();"/>
</div>

   </BODY>
</HTML>

JavaScript

function hiden_button()
{
var table1 = document.getElementById('table1');
var table2 = document.getElementById('table2');
var show1t = document.getElementById('show1t');
var show2t = document.getElementById('show2t');
switch (show2t.id)

case 'show2t':
    table1.style.display = 'none';
    table2.style.display = 'block';
    show2t.style.display = 'none';
    break;
case 'show1t.id':
    table2.style.display = 'none';
    table1.style.display = 'block';
    show1t.style.display = 'block';
    break;
}