JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
  <li><span>1</span>
    <ul>
      <li><span>1</span></li>
      <li><span>1</span></li>
      <li><span>1</span>
        <ul>
          <li><span>1</span></li>
          <li><span>1</span></li>
          <li><span>1</span></li>
          <li><span>1</span></li>
          <li><span>1</span></li>
        </ul>
      </li>
      <li><span>1</span></li>
      <li><span>1</span></li>
    </ul>
  </li>
  <li><span>1</span></li>
  <li><span>1</span></li>
  <li><span>1</span></li>
  <li><span>1</span></li>
</ul>

CSS

ul {
  list-style: none;
}
ul li span{
  display:block;
}
ul li:hover > span {
  background-color: pink;
}

ul li:hover ul li {
  background-color: transparent;
}