Can someone please explain me this behaviour of code execution? JS

Question

Why is the button appended before even it creates the button ? Is it some kind of async behaviour of DOM API ??

CODE:

see code output

var li = document.createElement('li');
li.appendChild(document.createTextNode("list-item"));
console.log(li,"1")
var del = document.createElement("button");
del.appendChild(document.createTextNode('delete'))
li.appendChild(del)
console.log(li,"2")