previousSibling and nextSibling returns text?

Question

Could someone clarify why the code below returns #text instead of \'li\' ?

Shouldn\'t the next sibling of first li be li ? Similarly previous sibling of last li be

Answer 1

The whitespace between the two is also a node. That's why JS libraries exist. To give you options like retrieving element siblings.

If the HTML source looked like this:

<ul>
<li id="A"></li><li id="B"></li>
</ul>

It would work as you expect it, because there's no whitespace between the li elements.

More recently, two more properties have been introduced, called previousElementSibling and nextElementSibling, which ignore that whitespace. It works from IE9 and up, with the other major browsers supporting it for a while now.