# How to check if an element has children using JavaScript

By Atta Ur Rehman Shah (https://attacomsian.com/about). Published Aug 10, 2020, updated Sep 23, 2021. Topics: JavaScript.
Canonical URL: https://attacomsian.com/blog/javascript-dom-check-if-an-element-has-children

> Learn how to check if an HTML element has children by using the hasChildNodes() method in JavaScript.

To check if an HTML element has child nodes, you can use the `hasChildNodes()` method. This method returns `true` if the specified node has any child nodes, otherwise `false`.

Let us say you have the following HTML code snippet:

```html
<html>
<body>
    <div class="wrapper">
        <button id="btn">Click Me</button>
    </div>
</body>
</html>
```

The following example shows that how you can use the `hasChildNodes()` method to check if the `<body>` and `<button>` tags have any child nodes:

```javascript
const body = document.body;
const btn = document.querySelector('button');

console.log(body.hasChildNodes()); // true
console.log(btn.hasChildNodes()); // true
```

> Whitespace and comments inside a node are also considered as text and comment nodes. So if you leave any whitespace, comments, or line feeds inside an element, that element still has child nodes.

The `hasChildNodes()` method works in all modern browsers, and IE9 and up.
