JSFiddle - React, Tailwind, and code Playground

by Praveen Kumar Purushothaman

HTML

<a href="#">Show / Hide All</a>
<table>
    <tbody>
        <tr>
            <th style="border-bottom:1px solid #EB8D01;font-size: 12px;font-weight: bold;font-family: verdana, helvetica, sans-serif;padding-bottom: 2px;">
                <a href="0/posts/10-Auto/">Auto</a> <span class="count">(1)</span>
            </th>
        </tr>
        <tr>
            <td style="padding: 2px;border-bottom: 1px solid #F4F4F4;"><a href="0/posts/10-Auto/17-Cars/">Cars</a><br></td>
        </tr>
        <tr>
            <td style="padding: 2px;border-bottom: 1px solid #F4F4F4;"><a href="0/posts/10-Auto/18-Car-Accessories/">Car Accessories</a><br></td>
        </tr>
        <tr>
            <td style="padding: 2px;border-bottom: 1px solid #F4F4F4;"><a href="0/posts/10-Auto/20-Car-Cleaning-Detailing/">Car Cleaning &amp; Detailing</a><br></td>
        </tr>
        <tr>
            <td style="padding: 2px;border-bottom: 1px solid #F4F4F4;"><a href="0/posts/10-Auto/24-Car-Audio/">Car Audio</a><br></td>
        </tr>
        <tr>
            <td style="padding: 2px;border-bottom: 1px solid #F4F4F4;"><a href="0/posts/10-Auto/29-Motorcycles/">Motorcycles</a><br></td>
        </tr>
    </tbody>
    <tbody class="more hidden">
        <tr>
            <td style="padding: 2px;border-bottom: 1px solid #F4F4F4;"><a href="0/posts/10-Auto/35-Other-Commercial-Vehicles/">Other Commercial Vehicles</a><br></td>
        </tr>
        <tr>
            <td style="padding: 2px;border-bottom: 1px solid #F4F4F4;"><a href="0/posts/10-Auto/39-Driving-Schools/">Driving Schools</a><br></td>
        </tr>
        <tr>
            <td style="padding: 2px;border-bottom: 1px solid #F4F4F4;"><a href="0/posts/10-Auto/41-Service-repairs/">Service &amp; repairs</a><br></td>
        </tr>
        <tr>
            <td style="padding: 2px;border-bottom: 1px solid #F4F4F4;"><a href="0/posts/10-Auto/42-Spare-parts/">Spare parts</a><br></td>
        </tr>
        <tr>
            <td style="padding: 2px;border-bottom:...

CSS

.hidden {display: none;}

JavaScript

$(document).ready(function(){
    $("a").click(function(){
        $(".more").toggleClass("hidden");
        return false;
    });
});