JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="flechalista">
    <li><a href="#">A</a>
<ul class="flechalista">
     <li>Enero</li>
     <li>Febrero</li>
     <li>Marzo</li>
     <li>Abril</li>
</ul>   
    </li>
</ul>


<ul class="flechalista">
    <li>
<ul class='tree'>
<li><span><a href='#' id=''>Appointment Reports</a></span>
<ul><li><span><a href='#' id=''>Appointment Summary Reports</a></span></li> 
<li><span><a href='#' id=''>Appointment Summary Statistics Reports</a></span></li>
<li><span><a href='#' id=''>Cancellations Reports</a></span></li>
<li><span><a href='#' id=''>Cancellations Reason Reports</a></span></li>
<li><span><a href='#' id=''>Department Reports</a></span></li>
<li><span><a href='#' id='load_ReportsRecordsPullList'>Medical Records Pull List Reports	</a></span></li>
<li><span><a href='#' id=''>No Show Reports</a></span></li>
<li><span><a href='#' id=''>Patient Reports</a></span></li>
<li><span><a href='#' id=''>Provider Reports</a></span></li>
<li><span><a href='#' id=''>Security List Reports</a></span></li>
<li><span><a href='#' id=''>Summary of Appointments by Provider Reports</a></span></li>                 
<li><span><a href='#' id=''>User Reports</a></span></li>
</ul>
    </li>
        </ul>

CSS

.flechalista{background:#FF0000;}
.flechalista li ul li{padding:5px 0 5px 50px !important; border-bottom:1px solid #000;}
.flechalista li a{padding:5px 0 5px 10px !important; display:block; width:100%; border-bottom:1px solid #000;}


.tree {
    list-style-type: none;
    margin-left: -60px;
    margin-top:-10px;
}

.tree ul
{
    list-style-type: none;
    margin-left:-35px;
}

.tree li > span {
    margin-left: 18px;
    border:1px solid #000;
    min-width:200px !important;
}

.tree li > .toggle {
    position: absolute;
    display: inline-block;
    background-position: center;
    background-repeat: no-repeat;
    height: 16px;
    width: 16px;
    cursor: pointer;
}

.tree li > div.closed {
    background-image: url(/base/img/expand_icon.png);
}

.tree li > div.open {
    background-image: url(/base/img/contract_icon.png);
}



.focus {
    background-color: #eee;
}