JSFiddle - React, Tailwind, and code Playground

HTML

<div id="cont">
<div id="tab">
<table border=1 style="border-collapse:collapse">
    <tr>
        <th colspan=7>FO</th>
    </tr>
    <tr>
        <th >A</th>
        <th >B</th> 
        <th >C</th> 
        <th >D</th> 
        <th >E</th>
    </tr>  
    <tr class="disable">
        <td >1</td>
        <td >1</td>
        <td >1</td>
        <td >1</td>
        <td >disable</td>
    </tr>
    <tr class="enable">
        <td >1</td>
        <td >1</td>
        <td >1</td>
        <td >1</td>
        <td >enable</td>
    </tr>
    <tr>
        <td colspan=7>FOVIP</td>
    </tr>
    <tr>
        <th >A</th>
        <th >B</th> 
        <th >C</th> 
        <th >D</th> 
        <th >E</th>
    </tr>
    <tr class="disable">
        <td >8</td>
        <td >1</td>
        <td >1</td>
        <td >1</td>
        <td class="disable" >disable</td>
    </tr>
    <tr class="enable">
        <td >1</td>
        <td >1</td>
        <td >2</td>
        <td >1</td>
        <td >enable</td>
    </tr>
</table>
</div>
<div id="button">
<span id="affiche">
<button >clique ici s'il te plait</button>
 </span>
<span id="refresh">
</span>
</div>
 
</div>

JavaScript

function showhide(){
$(".disable").toggle();
}

$( function(){
$('#affiche button').on('click', showhide);
})