JSFiddle - React, Tailwind, and code Playground

HTML

<table id="ldflksdf">
    <tr>
      <td>2</td>
      <td>2</td>
      <td><a id='butt' href="#" class="remove">Remove</a></td>
    </tr>
    <tr>
      <td>3</td>
      <td>3</td>
      <td><a href="#" class="remove">Remove</a></td>
    </tr>
         <tr>
      <td>4</td>
      <td>4</td>
      <td><a href="#" class="remove">Remove</a></td>
    </tr>    <tr>
      <td>5</td>
      <td>5</td>
      <td><a href="#" class="remove">Remove</a></td>
    </tr>
         <tr>
      <td>6</td>
      <td>6</td>
      <td><a href="#" class="remove">Remove</a></td>
    </tr>
</table>

JavaScript

$("#butt").click(function() {
    var className=$('#butt').attr('class');   
     alert(className);
        if(className=='show'){
         alert(className+'dfsdg');
   
       var rows = $('table.show tr');
          $(rows).show();   
                  $("#butt").removeClass('show');
        $("#butt").addClass('remove');
    }
    if(className=='remove'){
         $("#butt").removeClass('remove');
        $("#butt").addClass('show');
        $('table tbody tr').not(':first').hide();
        var $row = $this.closest("tr").nextAll(':hidden').first();
          $(row).closest("tr").hide();       

    }

 
});