jQuery Selectors

Very often, the first thing you’ll do in jQuery is select the element or elements that you’d like to work with. jQuery selectors allow us to get specific and target just the right element(s).

jQuery borrows many of its selectors from CSS, so many of them will look pretty familiar to a designer who knows a bit of CSS. In this video, we’ll take a look at the most commonly used jQuery selectors. These include:

• ID Selector
• Class Selector
• Tag or Element Selector
• Universal Selector
• Attribute Selector
• Hierarchy Selector
• Direct Descendent Selector
• Visibility Selectors
• Form Element Selectors

You’ll wrap your selectors in quotes – you can use either single or double quotes. I prefer to use single quotes since my fingers are lazy and it saves me from having to press the Shift key. That might sound silly, but when you’re typing hundreds of lines of JavaScript, it makes a big difference.

Now, this list of selectors is hardly exhaustive – there are dozens more types of jQuery selectors, but these are by far the most common and you’ll find that just knowing these will cover most cases where you need to select elements.

Join me again next week when we’ll cover adding content to your HTML pages with jQuery.