jQuery :nth-last-child() Selector Last Updated : 17 Nov, 2022 Comments Improve Suggest changes Like Article Like Report The jQuery :nth-last-child() selector is used to select all elements that are the nth last child of their parent. The counting of elements starts from the last element. Syntax: :nth-last-child( n | even | odd | formula )Parameters: The :nth-last-child() selector contain parameters which are listed below: n: It holds the child index number of the selected elements. The counting starts from the end. The index number of the first child is 1.even: It selects all even child elements.odd: It selects all odd child elements.formula: It is used to specify the formula to select the child element. The formula can be in form of (an + b).Below examples illustrate the :nth-last-child() selector in jQuery: Example 1: This example changes the background color to green and text color to the white of the second last heading of their parents (div tags). HTML <!DOCTYPE html> <html> <head> <title> jQuery :nth-last-child() Selector </title> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script> <!-- Script to use nth-last-child selector --> <script> $(document).ready(function () { $("h4:nth-last-child(2)").css({ "background-color": "green", "color": "white" }); }); </script> <style> option { font-weight: bold; font-size: 25px; color: green; } select { font-weight: bold; font-size: 25px; color: green; } </style> </head> <body style="text-align:center;"> <h1> jQuery | :nth-last-child() Selector </h1> <div style="border: 1px solid blue;"> <h4>The first heading in first div.</h4> <h4>The second last heading in first div.</h4> <h4>The last heading in first div.</h4> </div><br> <div style="border: 1px solid blue;"> <h4>The first heading in second div.</h4> <h4>The second last heading in first div.</h4> <h4>The last heading in second div.</h4> </div> </body> </html> Output: Example 2: This example changes the background color to green and the text color to white of the second last heading of the <body> tag. HTML <!DOCTYPE html> <html> <head> <title> jQuery :nth-last-child() Selector </title> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script> <!-- Script to use nth-last-child selector --> <script> $(document).ready(function () { $("h4:nth-last-child(3)").css({ "background-color": "green", "color": "white" }); }); </script> <style> option { font-weight: bold; font-size: 25px; color: green; } select { font-weight: bold; font-size: 25px; color: green; } </style> </head> <body style="text-align:center;"> <h1> jQuery | :nth-last-child() Selector </h1> <div style="border: 1px solid blue;"> <h4>The first heading in first div.</h4> <h4>The second last heading in first div.</h4> <h4>The last heading in first div.</h4> </div><br> <div style="border: 1px solid blue;"> <h4>The first heading in second div.</h4> <h4>The second last heading in first div.</h4> <h4>The last heading in second div.</h4> </div> </body> </html> Output: Comment More infoAdvertise with us Next Article jQuery :nth-last-child() Selector P PranchalKatiyar Follow Improve Article Tags : Web Technologies JQuery jQuery-Selectors Similar Reads jQuery * Selector The jQuery * selector selects all the elements in the document, including HTML, body, and head. If the * selector is used together with another element then it selects all child elements within the element used. Syntax: $("*")Parameters: *: This parameter is used to select all elements.Example 1: Se 1 min read jQuery #id Selector jQuery is an open-source JavaScript library that simplifies the interactions between an HTML/CSS document, or more precisely the Document Object Model (DOM), and JavaScript. Elaborating on the terms, it simplifies HTML document traversing and manipulation, browser event handling, DOM animations, Aja 1 min read jQuery .class Selector The jQuery .class selector specifies the class for an element to be selected. It should not begin with a number. It gives styling to several HTML elements. Syntax: $(".class") Parameter: class: This parameter is required to specify the class of the elements to be selected.Example 1: In this example, 1 min read jQuery multiple classes Selector The jQuery multiple class selector is used to select multiple classes of an HTML document. Syntax: $(".class1, .class2, .class3, ...")Parameter: class: This parameter is required to specify the class of the elements to be selected.Example 1: In this example, we will select the multiple classes by us 1 min read jQuery element Selector jQuery is an open-source JavaScript library that simplifies the interactions between an HTML/CSS document, or more precisely the Document Object Model (DOM), and JavaScript. Elaborating the terms, it simplifies HTML document traversing and manipulation, browser event handling, DOM animations, Ajax i 1 min read jQuery multiple elements Selector The jQuery multiple elements Selector is used to select multiple elements of an HTML document. Syntax: $("element1, element2, element3, ...")Parameter: element: This parameter is required to specify the elements to be selected.Example 1: In this example, we will select the multiple elements by using 1 min read jQuery :first Selector The jQuery :first Selector is used to select the first element of the specified type. Syntax: $(":first")Example 1: In this example, we will select the first <p> element by using jQuery :first Selector. HTML <!DOCTYPE html> <html> <head> <script src= "https://ajax.goo 1 min read jQuery :last Selector The jQuery :last Selector is used to select the last element of the specified type. Syntax: $(":last")Example 1: In this example, we will select the last <p> element by using jQuery :last Selector. HTML <!DOCTYPE html> <html> <head> <script src= "https://ajax.googleap 1 min read jQuery :even Selector jQuery is an open-source JavaScript library that simplifies the interactions between an HTML/CSS document, or more precisely the Document Object Model (DOM), and JavaScript. Elaborating on the terms, it simplifies HTML document traversing and manipulation, browser event handling, DOM animations, Aja 2 min read jQuery :odd Selector jQuery is an open-source JavaScript library that simplifies the interactions between an HTML/CSS document, or more precisely the Document Object Model (DOM), and JavaScript. Elaborating the terms, it simplifies HTML document traversing and manipulation, browser event handling, DOM animations, Ajax i 2 min read Like