JSFiddle - React, Tailwind, and code Playground

HTML

<nav>
    <ul><div id="logo">
            <img src="images/design/logo.png" alt="Logo for responsive template" />
        </div>
        <li>Home</li>
        <li>Parrent Link
            <ul>
                <li>Child Link</li>
                <li>Child Link</li>
                <li>Parrent Link
                    <ul>
                        <li>Child Link</li>
                        <li>Child Link</li>
                        <li>Child Link</li>
                        <li>Child Link</li>
                        <li>Child Link</li>
                    </ul>
                </li>
            </ul>
        </li>
        <li>About</li>
        <li>Gallery</li>
        <li>Contact</li>
    </ul>
</nav>

CSS

li {
    color: black;
}
.colored{
    color: green;
}

JavaScript

$(function(){
    $('li').each(function(){   
        var parent = $(this).parent().parent();
        if(parent.is('li')){
            parent.addClass("colored");
        } 
    })
});