Descendant ('ancestor descendant')S2C Home « Selectors « Descendant ('ancestor descendant')
Descendant selector.
Shorthand version $('ancestor descendant')
Description
The ('ancestor descendant') selector, selects all the specified direct child elements of the specified parent element.
Syntax
| Signature | Description |
|---|---|
jQuery('ancestor descendant') | Descendant match |
Parameters
| Parameter | Description |
|---|---|
ancestor | A valid selector. |
descendant | A filter to select the descendant. |
Return
N/A.
Descendant ('ancestor descendant') ExamplesTop
Selects all specified descendant elements of the specified ancestor element.
The following example will select all 'td' descendants of 'tr' elements and change the background color of these elements to orange (table data elements).
$(function(){
$('#btn1').on('click', function() {
$('tr td').css('backgroundColor', 'orange');
});
});
The following example will select all 'span' descendants of 'b' elements and change the background color of these elements to yellow (code examples).
$(function(){
$('#btn2').on('click', function() {
$('b span').css('backgroundColor', 'yellow');
});
});
The following example will select all 'td' descendants of 'tr' elements and change the background color of these elements to silver (h3 headings in left sidebar).
$(function(){
$('#btn3').on('click', function() {
$('div h3').css('backgroundColor', 'silver');
});
});