Remove all child elements of a DOM node in JavaScript

Question

How would I go about removing all of the child elements of a DOM node in JavaScript?

Say I have the following (ugly) HTML:

    &         


        

Answer 1

Why aren't we following the simplest method here "remove" looped inside while.

const foo = document.querySelector(".foo");
while (foo.firstChild) {
  foo.firstChild.remove();     
}

• Selecting the parent div
• Using "remove" Method inside a While loop for eliminating First child element , until there is none left.