JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
 <svg version="1.1" id="nav-menu" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
       viewBox="0 0 2500 632" style="enable-background:new 0 0 2500 632;" xml:space="preserve">
    <style type="text/css">
      .st0{fill:#EBDFBF;}
      .st1{fill:#F7ECCC;}
      .st2{fill:#C7A583;}
      .st3{fill:#D7C59E;}
      .st4{fill:#926862;}
      .st5{fill:#AE8A71;}
      .st6{fill:#ECDBB8;}
      .st7{fill:#AD8971;}
      .st8{fill:#C6A482;}
      .st9{fill:#DDCDAA;}
    </style>
    <g id="nav-handle" transform="translate(-6033 -7178.25)">
      <g id="nav-frame" transform="translate(2426 814)">
        <g id="handle-nav-01-category" transform="translate(-4297 1611.25)">
          <g id="Group_647" transform="translate(-1121 1674)">
            <g id="Group_611" transform="translate(9245 3078.516)">
              <path id="Path_108" class="st0" d="M90,205.48h262v15H45v-30h15v15H90z"/>
              <path id="Path_109" class="st1" d="M352,220.48v-15h15v-15h15v-15h30v45H352z"/>
              <path id="Path_110" class="st1" d="M45,190.48v30H0v-45h30v15H45z"/>
              <path id="Path_111" class="st2" d="M0,145.48h30v15H0V145.48z"/>
              <path id="Path_112" class="st2" d="M382,160.48v-15h30v15H382z"/>
              <path id="Path_113" class="st0" d="M0,160.48h30v15H0V160.48z"/>
              <path id="Path_114" class="st0" d="M382,160.48h30v15h-30V160.48z"/>
              <path id="Path_115" class="st2" d="M206,205.48h-60v-15h60V205.48z"/>
              <path id="Path_116" class="st2" d="M306,205.48h-55v-15h55V205.48z"/>
              <path id="Path_117" class="st2" d="M90,205.48H60v-15h30V205.48z"/>
              <path id="Path_118" class="st2" d="M30,175.48v-15h15v15H30z"/>
              <path id="Path_119" class="st2" d="M382,160.48v15h-15v-15H382z"/>
              <path id="Path_120" class="st2" d="M60,190.48H45v-15h15V190.48z"/>
             ...

JavaScript

$('[id^="off-btn-nav"], [id^="on-btn-nav"]').click(function() {
    let idParts = this.id.split("-");
    let number = idParts[idParts.length - 2];
    if (idParts[0] === "on") {
        $(`#on-btn-nav-${number}-${idParts[idParts.length - 1]}`).hide();
        $(`#off-btn-nav-${number}-${idParts[idParts.length - 1]}`).show();
    } else {
        $(`#on-btn-nav-${number}-${idParts[idParts.length - 1]}`).show();
        $(`#off-btn-nav-${number}-${idParts[idParts.length - 1]}`).hide();
    }
});