JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  <div id="app"></div>
  
</body>
</html>

JavaScript

const f1 = (x) => new Promise((resolve, reject) => {
	resolve(x);
})

const app = document.querySelector("#app");
const ul = document.createElement("ul");
app.appendChild(ul);
for (let i = 0; i < 10; i++) {
	f1(i).then((x) => {
  		const tn = document.createTextNode(x);
  		const li = document.createElement("li");
  		li.appendChild(tn);
			ul.appendChild(li);
    }
	);
}

const asf = async () => {
  for (let i = 0; i < 10; i++) {
    const x = await f1(i)
    const tn = document.createTextNode(x);
    const li = document.createElement("li");
    li.appendChild(tn);
    ul.appendChild(li);
  }
}
asf();