The lastElementChild property returns the last child element of the specified element.
The following code gets the HTML content of the last child element of an <ul> element:
var x = document.getElementById("myList").lastElementChild.innerHTML;
Click the button to get the HTML content of the list's last child element.
<!DOCTYPE html> <html> <body> <p>Example list:</p> <ul id="myList"> <li>CSS</li> <li>HTML</li> </ul>/* w ww . j ava2 s. c o m*/ <button onclick="myFunction()">Test</button> <p id="demo"></p> <script> function myFunction() { var list = document.getElementById("myList").lastElementChild.innerHTML; document.getElementById("demo").innerHTML = list; } </script> </body> </html>
The lastChild returns the last child node as an element node, a text node or a comment node.
The lastElementChild returns the last child node as an element node not including text and comment nodes.
This property is read-only.
Use the children property to return any child element of a specified element.
To return the first child element of a specified element, use the firstElementChild property.
The lastElementChild property returns a Node object representing the last child element of an element, or null if there are no child elements.