JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css">

  <header>
    <!-- place navbar here -->
  </header>
  <main>

    <div class="d-flex justify-content-around">
        <div class="container row">
          <div class="col-12" id="displayNumbers" style="min-height: 100px; border: 1px solid black;"></div>
          <div class="col-12" id="">
            <div class="btn" id="trigger" style="border: 1px solid red">
              Async / Await
            </div>
          </div>
        </div>
    </div>

  </main>
  <footer>
    <!-- place footer here -->
  </footer>

JavaScript

var displayArea = document.getElementById("displayNumbers");

    async function fetchNumbers(){
      console.log("--fetchNumbers--")
      axios.get("http://numbersapi.com/random/year?json", //{}
      ).then(function (response) {
        console.log("response fetchNumbers data:")
        console.log(response.data);
        numbersData = response.data;
      })
    }

    async function displayNumbers(data){
      console.log("--displayNumbers--")
      console.log(data);
      for (let d in data){
        console.log(d);
        let div = document.createElement("div");
        div.textContent = data[d].toString();
        displayArea.appendChild(div);
      }
    }

    async function processNumbers(){
    console.log("--processNumbers--")
      let divs = displayArea.querySelectorAll("div");
      for (let div of divs){
        const reg = new RegExp('^[0-9]+$');
        if (reg.test(div.textContent)){
          div.style = "background-color: black; color: white;"
        }
      }
    }

    var numbersData = {};
    async function async_numbers(){
      try{
        await fetchNumbers();
        await displayNumbers(numbersData);
        await processNumbers();
      } catch(e){console.log("Error " + e)}
    }

    document.getElementById("trigger").addEventListener("click", async() => {
      async_numbers();
    })