gt selectorversion deprecated: 3.4
Description: Select all elements at an index greater than
index within the matched set.
version added: 1.0jQuery( ":gt(index)" )
index: Zero-based index.
version added: 1.8jQuery( ":gt(-index)" )
indexFromEnd: Zero-based index, counting backwards from the last element.
As of jQuery 3.4, the
:gt pseudo-class is deprecated. Remove it from your selectors and filter the results later using
.slice(). For example,
:gt(3) can be replaced with a call to
.slice( 4 ) (the provided index needs to be increased by one).
The index-related selector expressions (including this "greater than" selector) filter the set of elements that have matched the expressions that precede them. They narrow the set down based on the order of the elements within this matched set. For example, if elements are first selected with a class selector (
.myclass) and four elements are returned, these elements are given indices 0 through 3 for the purposes of these selectors.
$( ".myclass:gt(1)" ) selects elements after the second element in the document with the class
myclass, rather than after the first. In contrast,
:nth-child(n) uses 1-based indexing to conform to the CSS specification.
Prior to jQuery 1.8, the
:gt(index) selector did not accept a negative value for
:gt()is a jQuery extension and not part of the CSS specification, queries using
:gt()cannot take advantage of the performance boost provided by the native DOM
querySelectorAll()method. For better performance in modern browsers, use
Give TD #5 and higher a yellow background and TD #8 a red text color.
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>gt demo</title> <script src="https://code.jquery.com/jquery-3.5.0.js"></script> </head> <body> <table border="1"> <tr><td>TD #0</td><td>TD #1</td><td>TD #2</td></tr> <tr><td>TD #3</td><td>TD #4</td><td>TD #5</td></tr> <tr><td>TD #6</td><td>TD #7</td><td>TD #8</td></tr> </table> <script> $( "td:gt(4)" ).css( "backgroundColor", "yellow" ); $( "td:gt(-2)" ).css( "color", "red" ); </script> </body> </html>