const div = document.createElement('div');
div.classList.add('box');

div.addEventListener('click',()=>{
  div.classList.toggle('circle')
});

document.body.appendChild(div);

とありますが

divにdocument.createElement('div')を代入しているので

const div = document.createElement('div');
document.createElement('div').classList.add('box');
document.createElement('div').addEventListener('click', () => {
  document.createElement('div').classList.toggle('circle');
});

document.body.appendChild(document.createElement('div'));

と書き換えても動作プラウザに映ると思ってましたが映りません。
理由が分からないので教えて頂けますか。