Node.nextSibling

The Node.nextSibling read-only property returns the node immediately following the specified one in their parent's childNodes, or returns null if the specified node is the last child in the parent element.

Syntax

nextNode = node.nextSibling

Notes

Element.nextElementSibling may be used to obtain the next element skipping any whitespace nodes, other between-element text, or comments.

Example

<div id="div-1">Here is div-1</div>
<div id="div-2">Here is div-2</div>

<script>
var el = document.getElementById('div-1').nextSibling,
    i = 1;

console.group('Siblings of div-1:');

while (el) {
  console.log(i, '. ', el.nodeName);
  el = el.nextSibling;
  i++;
}

console.groupEnd();
</script>

/**************************************************
  The console displays the following:

     Siblings of div-1

      1. #text
      2. DIV
      3. #text
      4. SCRIPT

**************************************************/

In the above example, #text nodes are inserted in the DOM where whitespace occurs between tags (i.e. after the closing tag of an element and before the opening tag of the next).

The possible inclusion of text nodes must be allowed for when traversing the DOM using nextSibling. See the resources in the Notes section.

Specifications

Browser compatibility

See also

• Element.nextElementSibling