JSFiddle - React, Tailwind, and code Playground

by Johan Vandeplas

HTML

<table class="mgmtview_table">
    <tr>
        <td class="filter_td" id="filter_td"></td> 
        <td class="show_hide">
            <a href="#" id="show_hide" alt="Hide Filters" title="Hide Filters">&lt;&lt;</a>
        </td>
        <td class="content" id="content">blah</td>
    </tr>
</table>

JavaScript

$('#show_hide').click(toggleFilters);

function toggleFilters() {
    var td = $("#filter_td");
    
    td.toggle('slow', function(){        
        if (td.is(":visible")){         
            $("#show_hide").html("&lt;&lt;").attr('title', 'Hide Filters');     
        } else {         
            $("#show_hide").html("&gt;&gt;").attr('title', 'Show Filters');     
        } 
    }); 
}