My Blog

Selector Example Description :hidden $(“p:hidden”) Selects all <p> elements that are hidden. :visible $(“p:visible”) Selects all <p> elements that are visible.

Selector Example Description parent > child $(“ul > li”) Selects all <li> elements that are direct child of their parent <ul> element. ancestor descendant $(“form label”) Selects all <label> elements that are descendant of their ancestor <form> element. prev + next $(“h1 + p”) Selects all <p> elements that are next i.e. immediately preceded to the <h1> elements. prev ~ siblings $(“h1 ~ p”) Selects all <p> elements that are…

Selector Example Description [attribute] $(“[href]”) Selects all elements with a href attribute, with any value. [attribute=”value”] $(‘a[target=”_blank”]’) Selects all <a> elements that have the target attribute with a value equal to “_blank”. [attribute=”value”] $(‘a[target!=”_blank”]’) Selects all <a> elements that don’t have the target attribute, or if have don’t with a value “_blank”. [attribute$=”value”] $(‘img[src$=”.png”]’) Selects all <img> elements that have the src attribute with a value ending with “.png”. [attribute|=”value”] $(‘a[hreflang|=”en”]’) Selects…

Selector Example Description :input $(“:input”) Selects all input, textarea, select and button elements (basically selects all form controls). :text $(“:text”) Selects all input elements with type=”text”. :password $(“:password”) Selects all input elements with type=”password”. :radio $(“:radio”) Selects all input elements with type=”radio”. :checkbox $(“:checkbox”) Selects all input elements with type=”checkbox”. :button $(“:button”) Selects all input and button elements with type=”button”.…

Selector Example Description :contains() $(‘p:contains(“Hello”)’) Selects all <p> elements that contains the text “Hello”. :empty $(“td:empty”) Selects all <td> elements that are empty i.e that have no children including text. :has() $(“p:has(img)”) Selects all <p> elements which contain at least one <img> element. :parent $(“:parent”) Select all elements that have at least one child node either an element or text.

Selector Example Description :first-child $(“p:first-child”) Selects all <p> elements that are the first child of their parent. :last-child $(“p:last-child”) Selects all <p> elements that are the last child of their parent. :nth-child(n) $(“p:nth-child(3)”) Selects all <p> elements that are the 3rd child of their parent. :only-child $(“p:only-child”) Selects all <p> elements that are the only child of their parent. :first-of-type $(“p:first-of-type”) Selects all <p> elements…

Selector Example Description :first $(“p:first”) Selects the first <p> element. :last $(“p:last”) Selects the last <p> element. :even $(“tr:even”) Selects all even <tr> elements, zero-indexed. :odd $(“tr:odd”) Selects all odd <tr> elements, zero-indexed. :eq() $(“tr:eq(1)”) Select the 2nd <tr> element within the matched set, zero-based index. :not() $(“p:not(:empty)”) Select all <p> elements that are not empty. :lt() $(“ul li:lt(3)”) Select all <li> elements at an index less than three…

jQuery SelectorsOrder by Alphabet This section contains a comprehensive list of selectors belonging to the latest jQuery JavaScript library. All the selectors are grouped into categories. Basic Selectors Selector Example Description * $(“*”) Selects all elements. #id $(“#foo”) Selects all elements with the id=”foo”. .class $(“.bar”) Selects all elements with the class=”bar”. element $(“p”) Selects all <p> elements. selector1,…