JSFiddle - React, Tailwind, and code Playground

by eventide

HTML

<!--
<div class="list_subpanel_cases">
<table>
<tbody>
<tr>
<td>
<span>Closed</span>
</td>
</tr>
<tr>
<td>
<span>Closed</span>
</td>
</tr>
</tbody>
</table>
</div>
-->
<div class="list_subpanel_account_usi_invoices">
    <table>
        <tbody>
            <tr>
                <td>
                    <span>Current</span>
                </td>
            </tr>
            <tr>
                <td>
                    <span>Past Due</span>
                </td>
            </tr>
        </tbody>
    </table>
</div>

CSS

.highlight {color: #f00;}

JavaScript

/*
function findCaseStatus() {

    var found = null;

    Y.all('.list_subpanel_cases span').some(function(node, index, nodeList) {
        if (node.getContent() == 'New' || node.getContent() == 'Assigned' || node.getContent() == 'Pending Input') {
            found = node;
            return (true); // stop looking for more
        }

        return (false); // keep looking for more
    });

    return (found);
}
*/
function findInvoiceStatus() {
    var found = null;

    Y.all('.list_subpanel_account_usi_invoices span').some(function(node, index, nodeList) {
        if (node.getContent() == 'Past Due') {
            found = node;
            return (true); // stop looking for more
        }

        return (false); // keep looking for more
    });

    return (found);
}

/*
var item = findCaseStatus();
if (item) {
    //alert('This account has Open Cases and/or Past Due Invoices');
    item.addClass("highlight");
}
*/
var item1 = findInvoiceStatus();
if (item) {
    item.addClass('highlight');
}