:last-childS2C Home « Selectors « :last-child
Last child selector.
Shorthand version $(':last-child')
Description
The :last-child selector, selects all last child elements of their parent.
- If this selector is not preceded by another selector, the universal selector ("*") is implied and so the whole DOM will be searched. Use another selector as in the examples below to narrow the search and improve performance.
Syntax
| Signature | Description |
|---|---|
jQuery(':last-child') | Last child match |
Parameters
None.
Return
N/A.
:last-child ExamplesTop
Selects all last child elements of their parent.
The following example will select the last 'td' elements within 'tr' elements and change the background colour of these elements to orange.
$(function(){
$('#btn1').on('click', function() {
$('tr td:last-child').css('backgroundColor', 'orange');
});
});
The following example will select the last 'p' elements within 'form' elements and change the background colour of these elements to grey.
$(function(){
$('#btn2').on('click', function() {
$('form p:last-child').css('backgroundColor', 'grey');
});
});
The following example will select the last 'code' elements within 'pre' elements and change the background colour of these elements to cyan.
$(function(){
$('#btn3').on('click', function() {
$('pre code:last-child').css('backgroundColor', 'cyan');
});
});