The jQuery :gt() Selector select all elements with an index greater than the index mentioned in the matched set.
Syntax:
$(":gt(Index)")
Parameter:
- index: Index number which is selected. The element which is greater than the specified index number is selected.
Example 1:
HTML
<!DOCTYPE html> < html >
< head >
< meta charset = "utf-8" >
< title >jQuery :gt() Selector</ title >
< script src =
</ script >
</ head >
< body >
< table style = "width:100%" border = "3" >
< tr >
< td >0</ td >
< td >1</ td >
< td >2</ td >
< td >3</ td >
< td >4</ td >
</ tr >
< tr >
< td >5</ td >
< td >6</ td >
< td >7</ td >
< td >8</ td >
< td >9</ td >
</ tr >
< tr >
< td >10</ td >
< td >11</ td >
< td >12</ td >
< td >13</ td >
< td >14</ td >
</ tr >
</ table >
< script >
$("td:gt(8)").css("backgroundColor", "lightgreen");
$("td:gt(3)").css("color", "red");
</ script >
</ body >
</ html >
|
Output:
Example 2:
HTML
<!DOCTYPE html> < html >
< head >
< meta charset = "utf-8" >
< title >jQuery :gt() Selector</ title >
< script src =
</ script >
</ head >
< body >
< table style = "width:100%" border = "3" >
< tr >
< td >0</ td >
< td >1</ td >
< td >2</ td >
</ tr >
< tr >
< td >3</ td >
< td >4</ td >
< td >5</ td >
</ tr >
< tr >
< td >6</ td >
< td >7</ td >
< td >8</ td >
</ tr >
< tr >
< td >9</ td >
< td >10</ td >
< td >11</ td >
</ tr >
</ table >
< br >
< button >Change color</ button >
< script >
$("button").click(function () {
$("td:gt(8)").css("backgroundColor", "lightblue");
});
</ script >
</ body >
</ html >
|
Output: