JSFiddle - React, Tailwind, and code Playground

HTML

<div class="treeCriteriaEngineModel">
<ul>
 <li><div class="body">
      
                        <div class="showHideList"><span class="labelInput">Tooling</span><i>  (6)</i></div>
                    </div>
                        <div id="hideshowPartial" style="display: block;">
                <ul>
                    <li><div class="body">
       
                        <div class="showHideList"><span class="labelInput">Blamap</span><i>  (1)</i></div>
                    </div>
                        <div id="hideshowPartial">
                <ul>
                  <li><div class="body">
                        <input type="checkbox" class="pull-left inputChecked">
                        <div class="showHideList"><span class="labelInput">Maintenance</span><i>  (3)</i></div>
                    </div>
                        <div id="hideshowPartial" style="display: block;">
                <ul>
                    <li><div class="body">
                        <div class="showHideList"><span class="labelInput">Maintenance videos</span><i>  (1)</i></div>
                    </div>
                        <div id="hideshowPartial" style="display: none">
                <ul>
                </ul>
            </div>
                    </li>
                    <li><div class="body">
       
                        <div class="showHideList"><span class="labelInput">Maintenance Guides</span><i>  (1)</i></div>
                    </div>
                        <div id="hideshowPartial" style="display: none">
                <ul>
                </ul>
            </div>
                    </li>
                    <li><div class="body">
          
                        <div class="showHideList"><span class="labelInput">Workscope Planning Guide</span><i>  (1)</i></div>
                    </div>
                        <div id="hideshowPartial" style="display: none">
                <ul>
                </ul>
            </div>
                    </li>
     ...

CSS

.myClass {
  color: red;
  font-weight: bold;
}

JavaScript

function addClassTreeColor(elem){
	var liItems = elem.children('li');
  $(liItems).each(function(i, li){
    var divs = $(li).children('div');
    var divBody = divs[0];
    var divSubItems = divs[1];
    var ulSub = $(divSubItems).children('ul')[0];
    if($(ulSub).children('li').length > 0){
    	$(divBody).hover(function() {
                        $( this )
                       .toggleClass("myClass");
			});
    }
    addClassTreeColor($(ulSub))
  })
}

var root = $('.treeCriteriaEngineModel ul:first');
addClassTreeColor(root)