You've seen why id attributes are so convenient for targeting with jQuery selectors. But you won't always have such neat ids to work with.
Fortunately, jQuery has some other tricks for targeting the right elements.
jQuery uses CSS Selectors to target elements. The
target:nth-child(n) CSS selector allows you to select all the nth elements with the target class or element type.
Here's how you would give the third element in each well the bounce class:
$(".target:nth-child(3)").addClass("animated bounce"); //target is the class of the element
target even or odd children¶
You can also target elements based on their positions using
Note that jQuery is zero-indexed which means the first element in a selection has a position of 0. This can be a little confusing as, counter-intuitively,
:odd selects the second element (position 1), fourth element (position 3), and so on.
Here's how you would target all the odd elements with class
target and give them classes:
$(".target:odd").addClass("animated shake"); ``//target is the class of the element