JSFiddle - React, Tailwind, and code Playground

HTML

<body class="main">
   <div id="parent">
    <span>Ordered List</span>
     <ol id="cakes">Country
      <li class="child">India</li>
      <li>London</li>
      <li class="child">Pakistan</li>
      <p>Just a paragraph in between.</p>
      <li>Australia</li>
     </ol>
   </div>
   <button>Click here to see effect</button>
  </body>

CSS

.main *
    { 
     display: block;
     border: 1px solid black;
     color: #cc3300;
     padding: 5px;
     margin: 5px;
    }

JavaScript

$("button").click(function(){
$("#parent").children().css({"color":"#002db3","border":"4px solid #004d00"});
});