JSFiddle - React, Tailwind, and code Playground

HTML

<div class="menu">
      <ul>

         <li><a href="Affichage.php?IDrubr=543">Opérations</a>
            <ul class="niveau1">
                  <li><a href="Affichage.php?IDrubr=606">3.1</a>
                        <ul class="left niveau2 ">
                           <li><a href="Affichage.php?IDrubr=653">OT</a></li>
                           <li><a href="Affichage.php?IDrubr=654">ON</a></li>
                           <li><a href="Affichage.php?IDrubr=655">EU</a></li>
                           <li><a href="Affichage.php?IDrubr=656">EM</a></li>
                        </ul>
                  </li>
                  <li><a href="Affichage.php?IDrubr=559">3.2</a>
                        <ul class="left niveau2 ">
                              <li><a href="Affichage.php?IDrubr=760">OT</a></li>
                              <li><a href="Affichage.php?IDrubr=761">EM</a></li>
                              <li><a href="Affichage.php?IDrubr=762">IA</a></li>
                              <li><a href="Affichage.php?IDrubr=763">AR</a>
                                       <ul class="left niveau3 ">
                                          <li><a href="Affichage.php?IDrubr=764">INF</a></li>
                                          <li><a href="Affichage.php?IDrubr=765">CAV</a></li>
                                          <li><a href="Affichage.php?IDrubr=766">ART</a></li>
                                          <li><a href="Affichage.php?IDrubr=767">ALT</a></li>
                                          <li><a href="Affichage.php?IDrubr=768">DSA</a></li>
                                       </ul>
                              </li>
                        </ul>
                  </li>
                  <li><a href="Affichage.php?IDrubr=571">3.3</a>
                        <ul class="left niveau2 ">
                              <li><a href="Affichage.php?IDrubr=706">EM</a></li>
                              <li><a href="Affichage.php?IDrubr=705">IA</a></li>
    ...

CSS

/* "Opérations" et ses enfants */
.menu > ul > li:nth-child(1) a {
    color: red;
}

/* "Prép" et ses enfants */
.menu > ul > li:nth-child(2) a {
    color: green;
}

/* "3.1" et ses enfants */
.menu > ul > li:nth-child(1) > ul > li:nth-child(1) a {
    color: purple;
}

/* "3.2" et ses enfants */
.menu > ul > li:nth-child(1) > ul > li:nth-child(2) a {
    color: orange;
}

/* "3.3" et ses enfants */
.menu > ul > li:nth-child(1) > ul > li:nth-child(3) a {
    color: yellow;
}

/* "7.1" et ses enfants */
.menu > ul > li:nth-child(2) > ul > li:nth-child(1) a {
    color: pink;
}

/* "7.2" et ses enfants */
.menu > ul > li:nth-child(2) > ul > li:nth-child(2) a {
    color: gray;
}