Почему создаётся три ul?

[Valera001]

Всем привет!
Есть такой код:
 

<script>

    var ul = document.createElement('ul');
    while(true) {
        var str = '';
        var user = prompt('Пишите содержимое пункта');
        if (user === null || user === str) {
            break
        }

        var li = document.createElement('li');
        li.innerHTML = user;
        ul.appendChild(li);
        console.log(ul);


    }
</script>

 

когда ввожу что-то в промт, программа создаёт столько ul сколько я ввёл, вместо того чтобы создать один ul со всеми пункатми что я ввёл в промт. Из чего это? 

 

[Switch74]

потому что...
 

   var ul = document.createElement('ul');
    while(true) {
        var str = '';
        var user = prompt('Пишите содержимое пункта');
        if (user === null || user === str) {
            break
        }

        var li = document.createElement('li');
        li.innerHTML = user;
        ul.appendChild(li);
    }
    
    console.log(ul);

 

[Valera001]

Неправильно? 

 

[Switch74]

суть правильная, но нужно понимать как работает console.log