JSFiddle - React, Tailwind, and code Playground

HTML

<div id=bad></div>
<br>
<div id=good></div>

JavaScript

good('this is good for async<br>')
bad('this is bad for async<br>')

for(i=0;i<10;i++){
	setTimeout(function(){bad(i)}, 1000) 	// bad for async
    setTimeout(good, 1000, i) 				// good for async
}

function bad(i){
	$('#bad').append(i)
}

function good(i){
	$('#good').append(i)
}