Please note, this is a STATIC archive of website www.tutorialrepublic.com from 10 Sep 2022, cach3.com does not collect or store any user information, there is no "phishing" involved.
JQUERY BASIC
JQUERY EFFECTS
JQUERY MANIPULATION
JQUERY ADVANCED
JQUERY EXAMPLES
JQUERY REFERENCE
Advertisements

jQuery Selectors

The following section contains a brief overview of jQuery selectors.

jQuery Selectors Order 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, selector2, selectorN $("h1, p.bar, span") Selects all <h1> and <span>, but only that <p> elements that has the class="bar".

Basic Filter Selectors

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 within the matched set (i.e. selects 1st, 2nd, 3rd list elements), zero-based index.
:gt() $("ul li:gt(3)") Select all <li> elements at an index greater than three within the matched set (i.e. selects 4th, 5th, ... list elements), zero-based index.
:header $(":header") Selects all elements that are headers, like <h1>, <h2>, <h3> and so on.
:lang() $(":lang(en)") Selects all elements that have a language value "en" i.e. lang="en", lang="en-us" etc.
:root $(":root") Selects the document's root element which is always <html> element in a HTML document.
:animated $(":animated") Select all elements that are animating at the time the selector is run.

Child Filter Selectors

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 that are the first <p> element of their parent.
:last-of-type $("p:last-of-type") Selects all <p> elements that are the last <p> element of their parent.
:only-of-type $("p:only-of-type") Selects all <p> elements that have no siblings with the same element name.
:nth-last-child(n) $("p:nth-last-child(3)") Selects all <p> elements that are the 3rd-child of their parent, counting from the last element to the first.
:nth-of-type(n) $("p:nth-of-type(2)") Selects all <p> elements that are the 2nd <p> element of their parent
:nth-last-of-type(n) $("p:nth-last-of-type(2)") Selects all <p> elements that are the 2nd-child of their parent, counting from the last element to the first.

Content Filter Selectors

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.

Form Selectors

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".
:submit $(":submit") Selects all input and button elements with type="submit".
:reset $(":reset") Selects all input and button elements with type="reset".
:image $(":image") Selects all input elements with type="image".
:file $(":file") Selects all input elements with type="file".
:enabled $(":enabled") Selects all elements that are enabled.
:disabled $(":disabled") Selects all elements that are disabled.
:selected $(":selected") Selects all elements that are selected, only works for <option> elements.
:checked $(":checked") Selects all elements that are checked or selected, works for checkboxes, radio buttons, and select elements.
:focus $(":focus") Selects element if it is currently focused.

Attribute Selectors

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 all <a> elements that have the hreflang attribute with a value equal to "en", or starting with "en" followed by a hyphen, like "en-US".
[attribute^="value"] $('img[title^="Smiley"]') Selects all <img> elements that have the title attribute with a value beginning exactly with a "Smiley" string.
[attribute~="value"] $('img[title~="Kites"]') Selects all <img> elements that have the title attribute with a value containing the word "Kites", delimited by spaces.
[attribute*="value"] $('input[name*="male"]') Selects all <input> elements that have the name attribute with a value containing the substring "male".

Hierarchy Selectors

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 siblings and follow after the <h1> elements.

Visibility Filter Selectors

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

This section contains a comprehensive list of selectors belonging to the latest jQuery JavaScript library. All the selectors are listed alphabetically.

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, selector2, selectorN $("h1, p.bar, span") Selects all <h1> and <span>, but only that <p> elements that has the class="bar".
ancestor descendant $("form label") Selects all <label> elements that are descendant of their ancestor <form> element.
parent > child $("ul > li") Selects all <li> elements that are direct child of their parent <ul> 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 siblings and follow after the <h1> elements.
:animated $(":animated") Select all elements that are animating at the time the selector is run.
[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[hreflang|="en"]') Selects all <a> elements that have the hreflang attribute with a value equal to "en", or starting with "en" followed by a hyphen, like "en-US".
[attribute*="value"] $('input[name*="male"]') Selects all <input> elements that have the name attribute with a value containing the substring "male".
[attribute~="value"] $('img[title~="Kites"]') Selects all <img> elements that have the title attribute with a value containing the word "Kites", delimited by spaces.
[attribute$="value"] $('img[src$=".png"]') Selects all <img> elements that have the src attribute with a value ending with ".png".
[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[title^="Smiley"]') Selects all <img> elements that have the title attribute with a value beginning exactly with a "Smiley" string.
:button $(":button") Selects all input and button elements with type="button".
:checkbox $(":checkbox") Selects all input elements with type="checkbox".
:checked $(":checked") Selects all elements that are checked or selected, works for checkboxes, radio buttons, and select elements.
:contains() $('p:contains("Hello")') Selects all <p> elements that contains the text "Hello".
:disabled $(":disabled") Selects all elements that are disabled.
:empty $("td:empty") Selects all <td> elements that are empty i.e that have no children including text.
:enabled $(":enabled") Selects all elements that are enabled.
:eq() $("tr:eq(1)") Select the 2nd <tr> element within the matched set, zero-based index.
:even $("tr:even") Selects all even <tr> elements, zero-indexed.
:file $(":file") Selects all input elements with type="file".
:first-child $("p:first-child") Selects all <p> elements that are the first child of their parent.
:first-of-type $("p:first-of-type") Selects all <p> elements that are the first <p> element of their parent.
:first $("p:first") Selects the first <p> element.
:focus $(":focus") Selects element if it is currently focused.
:gt() $("ul li:gt(3)") Select all <li> elements at an index greater than three within the matched set (i.e. selects 4th, 5th, ... list elements), zero-based index.
:has() $("p:has(img)") Selects all <p> elements which contain at least one <img> element.
:header $(":header") Selects all elements that are headers, like <h1>, <h2>, <h3> and so on.
:hidden $("p:hidden") Selects all <p> elements that are hidden.
:image $(":image") Selects all input elements with type="image".
:input $(":input") Selects all input, textarea, select and button elements (basically selects all form controls).
:lang() $(":lang(en)") Selects all elements that have a language value "en" i.e. lang="en", lang="en-us" etc.
:last-child $("p:last-child") Selects all <p> elements that are the last child of their parent.
:last-of-type $("p:last-of-type") Selects all <p> elements that are the last <p> element of their parent.
:last $("p:last") Selects the last <p> element.
:lt() $("ul li:lt(3)") Select all <li> elements at an index less than three within the matched set (i.e. selects 1st, 2nd, 3rd list elements), zero-based index.
:not() $("p:not(:empty)") Select all <p> elements that are not empty.
:nth-child(n) $("p:nth-child(3)") Selects all <p> elements that are the 3rd child of their parent.
:nth-last-child(n) $("p:nth-last-child(3)") Selects all <p> elements that are the 3rd-child of their parent, counting from the last element to the first.
:nth-last-of-type(n) $("p:nth-last-of-type(2)") Selects all <p> elements that are the 2nd-child of their parent, counting from the last element to the first.
:nth-of-type(n) $("p:nth-of-type(2)") Selects all <p> elements that are the 2nd <p> element of their parent
:odd $("tr:odd") Selects all odd <tr> elements, zero-indexed.
:only-child $("p:only-child") Selects all <p> elements that are the only child of their parent.
:only-of-type $("p:only-of-type") Selects all <p> elements that have no siblings with the same element name.
:parent $(":parent") Select all elements that have at least one child node either an element or text.
:password $(":password") Selects all input elements with type="password".
:radio $(":radio") Selects all input elements with type="radio".
:reset $(":reset") Selects all input and button elements with type="reset".
:root $(":root") Selects the document's root element which is always <html> element in a HTML document.
:selected $(":selected") Selects all elements that are selected, only works for <option> elements.
:submit $(":submit") Selects all input and button elements with type="submit".
:text $(":text") Selects all input elements with type="text".
:visible $("p:visible") Selects all <p> elements that are visible.
Advertisements
Bootstrap UI Design Templates