JSFiddle - React, Tailwind, and code Playground

by Tenderfeel

HTML

<ul>
<li><a href="/">menu1</a></li>
<li><a href="/foo/">menu2</a></li>
<li><a href="/foo/bar/">menu3</a></li>
<li><a href="/hoge/index.html">menu4</a></li>
</ul>

CSS

.foo{
    background:lightgray;
}

.bar {
    background:pink;
}

.hoge{
    background:greenyellow;
}

JavaScript

$(function(){
    $('a[href^="/foo"]').parent().addClass('foo');
    $('a[href$="bar/"]').parent().addClass('bar');
    $('a[href*="html"]').parent().addClass('hoge');
});