JSFiddle - React, Tailwind, and code Playground

by Ian Roberts

HTML

<div class="table1">
    <ul>
        <li>Sustainability</li>
        <li>Master Program</li>
        <li>Care Experience</li>
        <li>IT Initiatives</li>
    </ul>
</div>
<div class="table2">
    <ul>
        <li>Academic Research</li>
        <li>Components</li>
        <li>Building Ops</li>
        <li>Maintenance</li>
    </ul>
</div>
<div class="table3">
    <ul>
        <li>Medical</li>
        <li>Equipment</li>
        <li>Value Cost</li>
        <li>Transportation</li>
    </ul>
</div>
<div class="table4">
    <ul>
        <li>Sustainability</li>
        <li>Master Program</li>
        <li>Care Experience</li>
        <li>IT Initiatives</li>
    </ul>
</div>
<h1>it works with links too!</h1>
<div class="table5">
    <ul>
        <li><a href="#nogo">Sustainability</a></li>
        <li><a href="#nogo">Master Program</a></li>
        <li><a href="#nogo">Care Experience</a></li>
        <li><a href="#nogo">IT Initiatives</a></li>
    </ul>
</div>

CSS

.nav {
    background-color:#333333;
    color:#eaeaea;
}

JavaScript

//checks content of tag, adds class based on content

//Sustainability below is CaseSensative

//checks all div elements
//$(function(){
// $('div:has(li:contains(Sustainability))').addClass('nav');
//});

//checks specific class .table3
//$(function(){
// $('.table3:has(li:contains(Medical))').addClass('nav');
//});

//checks all div elements, adds clas if it contains a link to sustainability
//$(function(){
// $('div:has(a:contains(Sustainability))').addClass('nav');
//});

//checks specific class .table5, adds clas if it contains a link to sustainability
$(function(){
 $('.table5:has(a:contains(Sustainability))').addClass('nav');
});