jQuery :only-of-type Selector Last Updated : 06 Jul, 2023 Comments Improve Suggest changes Like Article Like Report The :only-of-type Selector is an inbuilt selector in jQuery, used to select all the elements that are the only child of their parent. Syntax: $("parent_name : only-of-type")Example 1: In this example, we are using only-of-type selectors. HTML <!DOCTYPE html> <html> <head> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script> <!-- Script to use only-of-type selector --> <script> $(document).ready(function () { $("p:only-of-type").css( "color", "green"); }); </script> </head> <body> <center> <!-- Division 1 --> <div style="border:1px solid;"> <p>Geek1 of first div.</p> <p>Geek2 of first div.</p> </div> <br> <!-- Division 2 --> <div style="border:1px solid;"> <p>The only Geek of second div.</p> </div> <br> <!-- Division 3 --> <div style="border:1px solid;"> <span>GeeksforGeeks</span> <p>The only Geek of third div.</p> </div> </center> </body> </html> Output: In the above example, all the only child element( here p tags ) of their parent( here div tags ) are formatted into green color i.e, "The only Geek of the second div." and "The only Geek of the third div.". Example 2: html <!DOCTYPE html> <html> <head> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script> <!-- Script to use only-of-type selector --> <script> $(document).ready(function () { $("p:only-of-type").css( "color", "green"); }); </script> </head> <body> <center> <!-- Children of division --> <h3>Division as a parent</h3> <div> <p>Geek1 of div.</p> <p>Geek2 of div.</p> </div> <!-- Only child of id --> <h3>ID as a parent.</h3> <id> <p>The only Geek of id.</p> </id> <!-- Only child of class --> <h3>Class as a parent.</h3> <class> <p>The only Geek of class.</p> </class> <!-- Only child of body --> <h3>Body as a parent.</h3> <p>The only Geek of body.</p> </center> </body> </html> Output: In the above example, all the only child element( here p tags ) of their respective parent are formatted into green color i.e, "The only Geek of id.", "The only Geek of class." and "The only Geek of the body." as every paragraph tag is considered the different child for each parent. Comment More infoAdvertise with us Next Article jQuery :only-of-type Selector vaishalichauhan3003 Follow Improve Article Tags : JQuery 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