JSFiddle - React, Tailwind, and code Playground

HTML

<u><a id="notes" title="Filter field notes">Filter</a></u><p>

<table id="qpidvulh_to-do_list">
    <tr>
        <td>
            <span>
                Content
            </span>
        </td>
        <td>
            <span>
                Content
            </span>
        </td>
    </tr>
    <tr>
        <td>
            <span style="color:#b3b3ff;">
                Content
            </span>
        </td>
        <td>
            <span>
                Content
            </span>
        </td>
    </tr>
    <tr>
        <td>
            <span>
                Content
            </span>
        </td>
        <td>
            <span>
                Content
            </span>
        </td>
    </tr>
    <tr>
        <td>
            <span>
                Content
            </span>
        </td>
        <td>
            <span>
                Content
            </span>
        </td>
    </tr>
    <tr>
        <td>
            <span style="color:#b3b3ff;">
                Content
            </span>
        </td>
        <td>
            <span>
                Content
            </span>
        </td>
    </tr>
</table>

CSS

body {font-family: Arial}
#notes {color: red; cursor: pointer}

JavaScript

$("a#notes").on("click", function() {   
    $("#qpidvulh_to-do_list tr").toggle();
    $("#qpidvulh_to-do_list tr td span[style='color:#b3b3ff;']").closest("tr").toggle();
} );