JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <tbody>
        <tr class="category">
            <td>TD 1</td>          
            <td>TD 2</td>
            <td>TD 3</td>
        </tr>
        <tr class="subcategory">
           <td>Sub TD 1</td>
            <td>Sub TD 2</td>
            <td>Sub TD 3</td>
           }
        </tr>            
        <tr class="category">
            <td>TD 1</td>          
            <td>TD 2</td>
            <td>TD 3</td>
        </tr>
        <tr class="subcategory">
           <td>Sub TD 1</td>
            <td>Sub TD 2</td>
            <td>Sub TD 3</td>
           }
        </tr>  
    </tbody>
</table>

CSS

.subcategory { 
 display:none;  
    background:#666666;
    color:#fff;
}

.category { 
 background:#ccc;   
    cursor:pointer;
}

td { 
 width:150px;   
}

JavaScript

$(document).ready(function() { 
    $('tr.category').on('click', function() { 
       $(this).next('.subcategory').fadeToggle(); 
    });
});