Get the Next Element with JavaScript nextElementSibling

01/02/2022

Contents

In this article, you will learn how to get the next element with JavaScript nextElementSibling.

What is nextElementSibling?

The nextElementSibling is a property that allows you to get the next element of the specified element.

The syntax is as follows.

let element = document.getElementById('element');

element.nextElementSibling; 

What you can get with nextElementSibling is a sibling element that has the same parent element except for the text node and comment node.

Get the next element with nextElementSibling

Get the next element adjacent to the element with the specified id.

HTML

<ul>
  <li id="target"></li>
  <li></li>
</ul>

JavaScript

let element = document.getElementById('target');
element.nextElementSibling;

//result
//<li>