JSFiddle - React, Tailwind, and code Playground

by timmah

HTML

<input type="checkbox" value="click me!" id="showHiddenRows"></input>
<table class="tableName">
    <tr id='foo'>
        <td>this row is hidden</td>
    </tr>
    <tr>
        <td>this row is not hidden</td>
    </tr>
</table>

JavaScript

$("#showHiddenRows").click(function() {
    if($(this).is(":checked")) {
        
        alert("showing"); //This pops up
        
        $(".tableName").each(function() {
            
            console.log('tablename');
            if($(".tableName").find("tr").attr("id") === 'foo') {
        
                console.log('found');
                $(".tableName").find("tr").attr("style", "display: initial;");
                alert("found a hidden row"); //This does not pop up...
            }
        });
    } else {
        alert("hiding");
        //essentially the same code here, but display:none;
    }
});