Sau bài này bạn sẽ biết cách chọn chính xác các element theo ý mình. Ví dụ sử dụng với unorderd list, trên thực tế bạn có thể sử dụng bất kỳ thẻ nào khác 
Trước tiên là mã HTML:
4 |
< li >< a href = "#" title = "not title" >list 3</ a ></ li > |
6 |
< li >< a href = "#" title = "title" >list 5</ a ></ li > |
Để lựa chọn tất cả các thẻ li, ta dùng
2 |
$( 'li' ).addClass( 'selected' ); |
Các lựa chọn nâng cao
01 |
// Chỉ chọn thẻ li đầu tiên |
02 |
$( 'li:first' ).addClass( 'selected' ); |
03 |
// Chỉ chọn thẻ li cuối cùng |
04 |
$( 'li:last' ).addClass( 'selected' ); |
05 |
// Chọn tất cả trừ thẻ li đầu tiên |
06 |
$( 'li:gt(0)' ).addClass( 'selected' ); |
07 |
// Chỉ chọn các thẻ li chẵn (bắt đầu từ 0) |
08 |
$( 'li:even' ).addClass( 'selected' ); |
09 |
// Chỉ chọn các thẻ li lẻ (bắt đầu từ 0) |
10 |
$( 'li:odd' ).addClass( 'selected' ); |
11 |
// Chọn thẻ li thứ tư (bắt đầu từ 1) |
12 |
$( 'li:nth-child(4)' ).addClass( 'selected' ); |
13 |
// Chọn thẻ li thứ tư (bắt đầu từ 0) |
14 |
$( 'li:eq(4)' ).addClass( 'selected' ); |
15 |
// Chọn các thẻ a ở trong li có title là "title" |
16 |
$( 'li a' ).addClass( 'selected' ); |
17 |
// Chọn các thẻ a ở ngay sau thẻ li |
18 |
$( 'li>a' ).addClass( 'selected' ); |
Bạn có thể dùng firebug để kiểm tra lại