greenEnTiRe

Чтобы понимать основы, как всё это работает.
Фреймворки и конструкторы меняются, а база остаётся.
Конструкторы занимают много места, у них есть баги, уязвимости и функционал их очень сильно ограничен - это основные недостатки, просто сходу

вместо div.insertBefore(loginMessage, password); попробуй

password.parentElement.insertBefore(loginMessage, password);

Дело в том, что getElementsByTagName возвращает динамическую коллекцию элементов, т.е. такую, которая автоматически обновляется при добавлении/удалении элементов. Поэтому сейчас у вас происходит следующее: удалили элемент с индексом 0, и у всех остальных элементов изменился индекс на единицу вниз, 0 вместо 1, 1 вместо 2 и т.д. При этом счётчик цикла вы на единицу увеличили, так что на следующей итерации удаляете элемент с индексом 1 - бывший 2. А тот, который был 1 и стал 0 - его вы пропускаете. А после следующего удаления пропускаете ещё один. Ну и т.д. Каждый второй.

Какие тут есть варианты действий:

• Замените document.getElementsByTagName("p") на document.querySelectorAll('p'), так вы получите статическую коллекцию элементов.
  
• Перебирайте содержимое allP от конца к началу:
  
  

  for (let i = allP.length; i--;) {
    body.removeChild(allP[i]);
  }

  
  
• Удаляйте элемент с нулевым индексом, пока есть что удалять:
  
  

  while (allP.length) {
    allP[0].remove();
  }

  
  
  

Ну и ещё кое-что. Обращаться к body по id - безумие, этот элемент существует в единственном экземпляре и ссылка на него доступна как свойство объекта document. Так что id уберите и замените document.getElementById("body") на document.body.