- jQuery Tutorial
- jQuery Home
- jQuery Intro
- What is jQuery
- jQuery History
- jQuery Example
- jQuery Selectors
- jQuery Get Started
- jQuery Syntax
- jQuery Selectors Manipulate
- jQuery Events
- jQuery Effects
- jQuery Effects
- jQuery Hide/Show
- jQuery Fade
- jQuery Slide
- jQuery Animate
- jQuery stop()
- jQuery Callback
- jQuery Chaining
- jQuery hide()
- jQuery show()
- jQuery toggle()
- jQuery fadeIn()
- jQuery fadeOut()
- jQuery fadeToggle()
- jQuery fadeTo()
- jQuery slideDown()
- jQuery slideUp()
- jQuery slideToggle()
- jQuery animate() Custom
- jQuery delay()
- jQuery HTML
- jQuery html()
- jQuery Get
- jQuery Set
- jQuery Add
- jQuery Remove
- jQuery CSS Classes
- jQuery css()
- jQuery Dimensions
- jQuery text()
- jQuery val()
- jQuery css() Custom
- jQuery before()
- jQuery prepend()
- jQuery after()
- jQuery insertAfter()
- jQuery append()
- jQuery appendTo()
- jQuery clone()
- jQuery remove()
- jQuery empty()
- jQuery detach()
- jQuery scrollTop()
- jQuery attr()
- jQuery prop()
- jQuery offset()
- jQuery position()
- jQuery addClass()
- jQuery hasClass()
- jQuery toggleClass()
- jQuery width()
- jQuery height()
- jQuery innerWidth()
- jQuery innerHeight()
- jQuery outerWidth()
- jQuery outerHeight()
- jQuery wrap()
- jQuery wrapInner()
- jQuery wrapAll()
- jQuery unwrap()
- jQuery Traversing
- jQuery Traversing
- jQuery Ancestors
- jQuery Descendants
- jQuery Siblings
- jQuery Filtering
- jQuery AJAX
- jQuery AJAX Intro
- jQuery Load
- jQuery Get/Post
- jQuery Misc
- jQuery closest() method
- jQuery noConflict()
- jQuery Filters
- jQuery ajax() method
- jQuery children() method
- jQuery data() method
- jQuery each() method
- jQuery eq() method
- jQuery extend() method
- jQuery filter() method
- jQuery find() method
- jQuery get() method
- jQuery grep() method
- jQuery length property
- jQuery is() method
- jQuery not() method
- jQuery param() method
- jQuery radio button
- jQuery read more/read less
- jQuery star rating
- :enabled selector
- :disabled selector
- noConflict() method
- :nth-child selector
- parent() method
- post() method
- ready() function
- removeAttr() method
- replaceWith() method
- resize() method
- siblings() method
- stop() method
- trigger() method
- trim() method
- jQuery getJSON() method
- jQuery replaceAll() method
- jQuery on() method
- jQuery off() method
- jQuery first() method
- jQuery last() method
- jQuery isNumeric() method
- jQuery :reset selector
- jQuery size() method
- jQuery contains() method
- jQuery ajaxSend() method
- jQuery ajaxError() method
- jQuery :lang() selector
- jQuery :lt() selector
- jQuery :gt() selector
- jQuery map() function
- jQuery next() method
- jQuery nextUntil() method
- jQuery error() method
- jQuery now() method
- jQuery parseJSON() method
- jQuery inArray() method
- jQuery dblclick() method
- jQuery $.proxy() method
- jQuery has() method
- jQuery index() method
- jQuery insertBefore() method
- jQuery merge() method
- jQuery nth-of-type() selector
- jQuery prev() method
- jQuery prevAll() method
- jQuery scroll() method
- jQuery scrollLeft() method
- jQuery slice() method
- jQuery contents() method
- jQuery nextAll() method
- jQuery offsetParent() method
- jQuery parents() method
- jQuery parentsUntil() method
- globalEval() method
- undelegate() method
- triggerHandler() method
- toArray() method
- removeProp() method
- removeData() method
- queue() method
- prependTo() method
- noop() method
- makeArray() method
- keypress() method
- isPlainObject() method
- isFunction() method
- isEmptyObject() method
- isArray() method
- focusout() method
- focusin() method
- event.preventDefault() method
- clearQueue() method
- andSelf() method
- andBack() method
- jQuery dequeue() method
- jQuery end() method
- jQuery even() method
- jQuery :file selector
- jQuery :hidden selector
- jQuery isWindow() method
- jQuery odd() method
- jQuery parseXML() method
- jQuery :password selector
- jQuery.unique() method
- jQuery.uniqueSort() method
- jQuery :visible selector
- jQuery.isXMLDoc() method
- jQuery add() method
- jQuery Examples
- jQuery Examples
- jQuery Editor
- jQuery Quiz
- jQuery Exercises
- jQuery Certificate
- jQuery Form
- jQuery serialize()
- jQuery serializeArray()
- jQuery References
- jQuery Overview
- jQuery Selectors
- jQuery Events
- jQuery Events
- jQuery click()
- jQuery bind()
- jQuery unbind() method
- jQuery blur()
- jQuery focus()
- jQuery select()
- jQuery change()
- jQuery submit()
- jQuery keydown()
- jQuery keypress()
- jQuery keyup()
- jQuery mouseenter()
- jQuery mouseleave()
- jQuery hover()
- jQuery mousedown()
- jQuery mouseup()
- jQuery mouseover()
- jQuery mouseout()
- jQuery load()
- jQuery unload()
- jQuery delegate()
- jQuery Effects
- jQuery HTML/CSS
- jQuery Traversing
- jQuery AJAX
- jQuery Misc
- jQuery Properties
- Selected Reading
- How to change the background image using jQuery
- How to Detect a Mobile Device
- offset vs position in jQuery
- Checkbox validation in jQuery
- Use of moment JS to change date format in jquery
- jQuery Redirect to Another Page After 5 Seconds
- JQuery Validation
- jQuery get Difference between two Dates in days
- Dynamic Drag and Drop table rows using JQuery Ajax
- Add Edit Delete Table Row in JQuery
- Add remove input fields dynamically using jQuery with Bootstrap
- JQuery photo gallery with thumbnail
- Dynamically Add Remove input fields using JQuery Ajax
- Barcode jQuery example
- jQuery Timepicker
- Read more functionality using jQuery
- jQuery CDN
- JQuery Pagination
- Get Selected Value in Drop-down in jQuery
- JQuery Input Mask Phone Number Validation
- Integrate jQuery Fullcalendar using Bootstrap, PHP and MySQL
- Allow only 10 numbers in textbox using Jquery
- JQuery left side menu
- Automatically Refresh or Reload a Page using jQuery
- Lazy load images using jQuery
- Create a Tic TAC Toe Game using jQuery
- How to Convert an HTML Table into Excel Spreadsheet using jQuery
- Import Excel data into HTML table using JQuery
- Create a To-Do list using JQuery
- JQuery Page Pilling
- QR Code Generator using HTML, CSS, and jQuery
- Phone Number Keyboard using HTML and jQuery
- JQuery UI Checkboxradio
- How to Create a Custom Image Magnifier using jQuery
- JQuery UI Control groups
- How to create a simple map using jQuery
- JQuery Blockrain/ Tetris game
- How to display a digital clock using HTML, CSS, and JavaScript
- JQuery Multiscroll.js
- JQuery Sort
- JQuery Calendar
- JQuery menu-aim plugin
- JQuery Typewriter
- JQuery Product Tour
- Upload image with progress bar using jQuery
- How to add options to a select element using jQuery
- How to remove close button from jQuery UI dialog using jQuery and css
- JQuery Crop Plugin
- Vertical Dot Navigation Plugin
- jQuery jTippy Tooltip Plugin
- Create a 3D Text Effect using HTML and CSS and jQuery
- Jquery Flickerplate Plugin
- jQuery bootstrapSelect Plugin
- Froala editor plugin
- Gauge chart plugin using jQuery
- Horizontal Scrollable Timeline Plugin - jTimeline
- Skype Chat jQuery Plugin
- Whatsapp Chat Widget
- Twenty Twenty jQuery Plugin to Compare Images
- jQuery Filter Table
- Language Translation with JavaScript
- jQuery Animated Border Plugin
- jQuery Palette Color Picker
- jQuery Excel Export Plugin Library
- jquery social counter plugin
- jQuery Page Flip
- How to create an online radio using jQuery and jPlayer
- jQuery File manager for web
- Automatically Format your Numbers and Currencies using jquery
- jquery cookie consent plugin
- jQuery Coverflow widget
- jQuery PayPal HTML Shop
- Full Screen video Background using jquery
- jQuery Push Notification Plugin
- Create a menu item animation on hover
- Jquery Countdown Timer
- Jquery dragStart Event
- Jquery dragStop event
- Picture Puzzle Game using Jquery
- Jquery Captcha Widget
- Jquery Search Slide out Plugin
- How to Get the Textbox Value in jQuery
- Planetarium Jquery Plugin
- jQuery on-place Confirm Boxes
- Carousel with Drag and Wheel using Jquery
- Before and After Slider using jQuery
- Round Slider jQuery Plugin
- Jquery sticky header
- jQuery Age Verification plugin
- Pietimer jQuery Plugin
- DoubleScroll using Jquery
- Day Night Toggle using Jquery
- Q&A
jQuery Selectors:
Use our jQuery Selector Tester to demonstrate the different selectors.
Selector | Example | Selects |
---|---|---|
* | $("*") | All elements |
#id | $("#lastname") | The element with id="lastname" |
.class | $(".intro") | All elements with class="intro" |
.class,.class | $(".intro,.demo") | All elements with the class "intro" or "demo" |
element | $("p") | All <p> elements |
el1,el2,el3 | $("h1,div,p") | All <h1>, <div> and <p> elements |
:first | $("p:first") | The first <p> element |
:last | $("p:last") | The last <p> element |
:even | $("tr:even") | All even <tr> elements |
:odd | $("tr:odd") | All odd <tr> elements |
:first-child | $("p:first-child") | All <p> elements that are the first child of their parent |
:first-of-type | $("p:first-of-type") | All <p> elements that are the first <p> element of their parent |
:last-child | $("p:last-child") | All <p> elements that are the last child of their parent |
:last-of-type | $("p:last-of-type") | All <p> elements that are the last <p> element of their parent |
:nth-child(n) | $("p:nth-child(2)") | All <p> elements that are the 2nd child of their parent |
:nth-last-child(n) | $("p:nth-last-child(2)") | All <p> elements that are the 2nd child of their parent, counting from the last child |
:nth-of-type(n) | $("p:nth-of-type(2)") | All <p> elements that are the 2nd <p> element of their parent |
:nth-last-of-type(n) | $("p:nth-last-of-type(2)") | All <p> elements that are the 2nd <p> element of their parent, counting from the last child |
:only-child | $("p:only-child") | All <p> elements that are the only child of their parent |
:only-of-type | $("p:only-of-type") | All <p> elements that are the only child, of its type, of their parent |
parent > child | $("div > p") | All <p> elements that are a direct child of a <div> element |
parent descendant | $("div p") | All <p> elements that are descendants of a <div> element |
element + next | $("div + p") | The <p> element that are next to each <div> elements |
element ~ siblings | $("div ~ p") | All <p> elements that appear after the <div> element |
:eq(index) | $("ul li:eq(3)") | The fourth element in a list (index starts at 0) |
:gt(no) | $("ul li:gt(3)") | List elements with an index greater than 3 |
:lt(no) | $("ul li:lt(3)") | List elements with an index less than 3 |
:not(selector) | $("input:not(:empty)") | All input elements that are not empty |
:header | $(":header") | All header elements <h1>, <h2> ... |
:animated | $(":animated") | All animated elements |
:focus | $(":focus") | The element that currently has focus |
:contains(text) | $(":contains('Hello')") | All elements which contains the text "Hello" |
:has(selector) | $("div:has(p)") | All <div> elements that have a <p> element |
:empty | $(":empty") | All elements that are empty |
:parent | $(":parent") | All elements that are a parent of another element |
:hidden | $("p:hidden") | All hidden <p> elements |
:visible | $("table:visible") | All visible tables |
:root | $(":root") | The document's root element |
:lang(language) | $("p:lang(de)") | All <p> elements with a lang attribute value starting with "de" |
[attribute] | $("[href]") | All elements with a href attribute |
[attribute=value] | $("[href='default.htm']") | All elements with a href attribute value equal to "default.htm" |
[attribute!=value] | $("[href!='default.htm']") | All elements with a href attribute value not equal to "default.htm" |
[attribute$=value] | $("[href$='.jpg']") | All elements with a href attribute value ending with ".jpg" |
[attribute|=value] | $("[title|='Tomorrow']") | All elements with a title attribute value equal to 'Tomorrow', or starting with 'Tomorrow' followed by a hyphen |
[attribute^=value] | $("[title^='Tom']") | All elements with a title attribute value starting with "Tom" |
[attribute~=value] | $("[title~='hello']") | All elements with a title attribute value containing the specific word "hello" |
[attribute*=value] | $("[title*='hello']") | All elements with a title attribute value containing the word "hello" |
:input | $(":input") | All input elements |
:text | $(":text") | All input elements with type="text" |
:password | $(":password") | All input elements with type="password" |
:radio | $(":radio") | All input elements with type="radio" |
:checkbox | $(":checkbox") | All input elements with type="checkbox" |
:submit | $(":submit") | All input elements with type="submit" |
:reset | $(":reset") | All input elements with type="reset" |
:button | $(":button") | All input elements with type="button" |
:image | $(":image") | All input elements with type="image" |
:file | $(":file") | All input elements with type="file" |
:enabled | $(":enabled") | All enabled input elements |
:disabled | $(":disabled") | All disabled input elements |
:selected | $(":selected") | All selected input elements |
:checked | $(":checked") | All checked input elements |