:last-of-typeS2C Home « Selectors « :last-of-type
Last of type child selector.
Shorthand version $(':last-of-type')
Description
The :last-of-type selector, selects elements that have no other element with both the same parent and the same element name coming after it in the document tree.
- 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-of-type') | Last of type selector match |
Parameters
None.
Return
N/A.
:last-of-type ExamplesTop
Selects all elements that are the last among siblings of the same element name.
The following example will check for the last 'h3' element that are the last among siblings within the document and turn the background colour yellow.
$(function(){
$('#btn1').on('click', function() {
$("h3:last-of-type").css('backgroundColor', 'yellow');
});
});
The following example will check for the last 'form' element within the document and turn the background colour orange (last form).
$(function(){
$('#btn2').on('click', function() {
$("form:last-of-type").css('backgroundColor', 'orange');
});
});
The following example will check for the last 'pre' element within the document and turn the background colour yellow (last preformatted code).
$(function(){
$('#btn3').on('click', function() {
$("pre:last-of-type").css('backgroundColor', 'silver');
});
});