# How to remove all children from a DOM element

> Learn how to remove all the children of a DOM element, the fastest way by setting innerHTML to an empty string, or with a while loop calling removeChild().

Author: [Flavio Copes](https://flaviocopes.com/about/) | Published: 2019-08-28 | Updated: 2019-12-03 | Topics: [Web Platform](https://flaviocopes.com/tags/platform/) | Canonical: https://flaviocopes.com/how-to-remove-children-element/

Given an item in the DOM, use [`querySelector()`](https://flaviocopes.com/selectors-api/) to identify it, like this:

```js
const item = document.querySelector('#itemId')
```

then, to remove all its children elements, you have a few different solutions.

The fastest way looks like this:

```js
item.innerHTML = ''
```

Another solution that is suggested is this: create a loop, check if the `firstChild` property is defined (the element has at least a child) and then remove it:

```js
const item = document.querySelector('#itemId')
while (item.firstChild) {
  item.removeChild(item.firstChild)
}
```

The loop ends when all children are removed.

The first, in most performance benchmarks I checked, looks like being the fastest solution.