JavaScript Document lastElementChild Property

Beginner
5 min read
Updated: Nov 2026
3 examples
Property
Decorative image with the word LASTELEMENTCHILD

Definition

Document.lastElementChild is a read-only property that returns the document’s last child Element, or null if there are none (MDN). For HTML documents this is usually the only child—the root <html> element.

Read the notes below before you get or set this property. Prefer feature detection when support is limited.

Syntax

Use document.lastElementChild. Start with this line.

JavaScript
document.lastElementChild
CallWhat it does
document.lastElementChildPrimary signature.

Built into the browser. Read or assign document.lastElementChild — no import required.

Library declarations
JavaScript
document.lastElementChild

Parameters

ParameterDescription
lastElementChildRequired. Read-only Element or null
Null checkOptional. Needed only for unusual empty documents

Return Value

Return ValueDescription
*The current value of document.lastElementChild.

JavaScript Examples

Example 1 — Read document.lastElementChild

Log the last element child of the document (MDN: usually <html>).

JavaScript
const root = document.lastElementChild;

console.log(root.tagName);
// "HTML" on a normal HTML page
Try It Yourself

How It Works

  1. Read the property. No arguments—access document.lastElementChild.
  2. Get an Element. On HTML pages this is the root <html> node.
  3. Inspect the tag. tagName is "HTML" (uppercase in HTML documents).
  4. MDN note. For HTML documents this is usually the only element child of document.

Example 2 — Same as documentElement?

On a typical page, lastElementChild, firstElementChild, and documentElement all refer to <html>.

JavaScript
const last = document.lastElementChild;
const first = document.firstElementChild;
const root = document.documentElement;

console.log(last === root);
console.log(first === last);
console.log(root.tagName);
Try It Yourself

How It Works

  1. Read three APIs. Last element child, first element child, and the dedicated root.
  2. Strict equality. On a normal HTML document they are the same object.
  3. Why first equals last. There is only one element child under document.
  4. Style tip. Prefer document.documentElement when your intent is “get the root.”

Example 3 — lastElementChild vs lastChild

lastChild can be a non-element node; lastElementChild always skips those.

JavaScript
const lastEl = document.lastElementChild;
const lastAny = document.lastChild;

console.log(lastEl && lastEl.nodeType);   // 1 = ELEMENT_NODE
console.log(lastAny && lastAny.nodeType); // 1, 3, 8, …
console.log(lastEl === lastAny);
Try It Yourself

How It Works

  1. Element-only. lastElementChild returns node type 1 (ELEMENT_NODE) or null.
  2. Any node. lastChild may be element, text (3), or comment (8).
  3. Often equal here. On many pages the last child of document is still <html>.
  4. Rule of thumb. Need an element? Use lastElementChild. Need any node? Use lastChild.
Compatibility

Browser Support

Document.lastElementChild is Baseline Widely available on MDN (since April 2018). It works across modern browsers as part of the ParentNode mixin.

✓ Baseline · Widely available

Document.lastElementChild

Read-only last child Element of the document — usually the root

element on HTML pages.

99% Browser support
Google Chrome Supported · Desktop & Mobile
Full support
Mozilla Firefox Supported · Desktop & Mobile
Full support
Apple Safari Supported · macOS & iOS
Full support
Microsoft Edge Supported · Chromium
Full support
Internet Explorer No native support · Use a polyfill
Polyfill
Opera Supported · Modern versions
Full support
Samsung Internet Supported · Android
Full support
Android WebView Supported · Modern WebView
Full support
lastElementChild Excellent

Bottom line: Safe everywhere you teach DOM APIs. Prefer document.documentElement when you specifically need the HTML root. Use Element.lastElementChild for children inside a specific element.

Frequently Asked Questions

The document's last child Element, or null if there are no child elements. For HTML documents this is usually the root <html> element (MDN).
No. MDN marks Document.lastElementChild as Baseline Widely available (since April 2018). It is a standard ParentNode property on Document.
lastChild can be any node type — text, comment, or element. lastElementChild skips non-element children and returns only the last Element.
On normal HTML pages with a single root element, yes — both typically refer to <html>. Prefer document.documentElement when you specifically mean the document root.
On typical HTML pages both point to the same <html> element because it is the only element child of the document.
When the document has no child elements. Typical HTML pages always have at least <html>, so you usually get an Element.

Next: lastModified

Learn how to read when the document was last modified as a string.

lastModified tutorial →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

11 people found this page helpful

JavaScript Document implementation Property JavaScript Document lastModified Property