jQuery Tutorial

jQuery HomejQuery Basic ProgramjQuery ready()jQuery noConflict()jQuery globalEval()jQuery trim()jQuery type()jQuery length

jQuery Methods

jQuery Callback MethodsjQuery Deferred MethodsjQuery Selector MethodsjQuery MouseEvent MethodsjQuery KeyboardEvent MethodsjQuery Form MethodsjQuery CSS MethodsjQuery Attribute MethodsjQuery DOM MethodsjQuery Array MethodsjQuery Object MethodsjQuery Effects MethodsjQuery Parser MethodsjQuery Event MethodsjQuery Time MethodsjQuery Check MethodsjQuery Event Handler MethodsjQuery Miscellaneous Methods

jQuery Properties

jQuery Event PropertiesjQuery Effects Properties

jQuery Selectors

jQuery Selectors

jQuery HTTP

LEARN AJAX

jQuery Reference

JS KeycodeMIME TypesASCII Table

jQuery :last-child Selector

Last Updated:

jQuery :last-child Selector

The jQuery :last-child selector selects all elements that are the last child of their parent.

In the following example, we are trying to select the <p> tag only if it is the last child of the <body> tag.

Example

HTML Editor
<!DOCTYPE html> <html lang="en-US"> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> $(document).ready(function(){ $("p:last-child").css("color","green"); }); </script> </head> <body> <h1>jQuery selector :last-child</h1> <p>This is paragraph</p> </body> </html>

Syntax

$(":last-child")

Browser Support

Devicedesktopmobile
Browsergoogle chromesafarifirefoxinternet Exploreredgeoperagoogle chromesafarifirefoxedgeoperaandroid webviewsamsung internet
:last-childYesYesYesYesYesYesYesYesYesYesYesYesYes

More Examples

Example

HTML Editor
<!DOCTYPE html> <html lang="en-US"> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> $(document).ready(function(){ $("h1:last-child").css("color","green"); }); </script> </head> <body> <h1>jQuery selector :last-child</h1> <p>This is paragraph</p> </body> </html>

Share this Page

Meet the Author