JSFiddle - React, Tailwind, and code Playground

HTML

<li id="item-126" class="item-126 deeper parent"> <span class="nav-header">About Us</span>

    <ul class="nav-child unstyled small">
        <li id="item-129" class="item-129"><a href="/v1/index.php/aboutus/bio">Bio</a> 
        </li>
        <li id="item-130" class="item-130 "><a href="/v1/index.php/aboutus/our-clients">Our Clients</a>
        </li>
    </ul>
</li>
<li id="item-127" class="item-127"><span class="nav-header">Services</span>
</li>
<li id="item-128" class="item-128"><span class="nav-header">Contact Us</span>
</li>

CSS

.up {
    -webkit-transition: 1s;
    -moz-transition: 1s;
    -ms-transition: 1s;
    -o-transition: 1s;
    transition: 1s;
    -webkit-transform: translateY(-532px);
    -moz-transform: translateY(-532px);
    -ms-transform: translateY(-532px);
    -o-transform: translateY(-532px);
    transform: translateY(-532px);
}

JavaScript

$('.item-126, .item-127, .item-128').click(function () {
    $('item-126, .item-127, .item-128').addClass('up');
    $(this).parent().addClass('up');
});
$('.item-129 a').click(function () {
    $('item-126, .item-127, .item-128').addClass('up');
    //$(this).parent().addClass('up');
});