Выборка элементов

В jQuery объекты выбираются через метод $(), в качестве параметра используется CSS-синтаксис.

$("p"); // выбирает <p>
$(".block"); // выбирает объекты с классом .block
$("#main"); // выбирает объект с ИД #main
$("#main .block");  // выбирает объекты .block внутри #main
$("#main,.block"); // выбирает объекты .block и объект #main

jQuery выбирает элементы справа налево. Например:

$('.product .price');

Код выше сначала выберет все  элементы .price, а потом уже выберет те элементы, которые находятся внутри класса .product.

Чтобы выбирать элементы только в нужном месте, сначала надо выбрать родитель по атриубу id (самый быстрый способ выборки).

var content = $('#content');

content.find(".price");
content.find(".image");
content.find(".rating");

В коде выше поиск нужных объектов производится только внутри элемента с ИД #content.

Стоит также обратить внимание, что объект #content сохранён в переменной. При следующей выборке, поиск элементов будет происходить внутри переменной, и не будет производиться повторная выборка.

Код выше можно сократить:

var content = $('#content');

$(".price", content);
$(".image", content);
$(".rating", content);

Если на сайте есть JavaScript-библиотека, которая уже использует метод $(), то вместо метода $() можно использовать jQuery(). Эти два метода ничем не отличаются, они нужны для того, чтобы избежать конфликты с другими библиотеками.

jQuery("p"); // тоже, что и $("p");

jQuery для выборки объектов использует библиотеку Sizzle (раньше входило в jQuery, сейчас есть возможность использовать отдельно).

Ссылка на библиотеку: sizzlejs.com/