JSFiddle - React, Tailwind, and code Playground

by Pearlin Lawrence

HTML

<article>
  <header>
      <h1> Top ten reasons</h1>
      <span class="author">Joshua</span><span class="date"> March 20th</span>
    </header>
    <ol id="reasons">
        <li>It's fun</li>
        <li>You will learn</li>
        <li>Advance</li>
        <li class="best"> Career</li>
    </ol>
 </article>

JavaScript

var topList = document.getElementById ("reasons");
//var reasons = topList.getElementsByName ("li");

for (var el =  topList.firstElementChild; el; el = el.nextElementSibling) {
    alert(el.textContent);

    if (el.classList.contains("best")){
        alert("The best reason to take a course is: " + el.textContent);
    }
        
}