JSFiddle - React, Tailwind, and code Playground

HTML

<div id="block8">
<div>fggb
<div>sfsfsfsfsfsfdsdf
<ol>
  <li class="active">
    </li>
  <li>
    
  </li>
</ol>


</div>
</div>

</div>
<div id="block7" >
<div>
<div>

<ol id="sup" >
  <li  slider="4">
    </li>
  <li  class="active" slider="5">
    
  </li>
   <li  slider="6">
    
    
  </li>
   <li slider="7">
    
  </li>
  
  
  
</ol>

</div>
</div>
</div>

CSS

#block8 {
    background-color: red;
}


#block7.slider4 {
    background-color: black;
}
#block7.slider5  {
    background-color: yellow;
}
#block7.slider6  {
    background-color: pink;
}
#block72  {
    background-color: green;
}
#block73 {
    background-color: blue;
}
#block76  {
    background-color: blue;
}
#block77  {
    background-color: blue;
}

JavaScript

var menu  = document.getElementById('block7'); 
    var a  = menu.getElementsByTagName('li');
    var aa  = menu.getElementsByClassName('active');

var t = document.getElementById("active"); 
var idAttr = t.getAttributeNode("id"); 
alert(idAttr.value == "top");