Вероятно, простой вопрос выбора jQuery

Question

У меня есть код, который выполняется при нажатии на ссылку. HTML структурирован:

<a href='link1'>Stuff<span class='color-bar'></span></a>
<a href='link2'>Stuff<span class='color-bar'></span></a>
<a href='link3'>Stuff<span class='color-bar'></span></a>

С jQuery вот так:

$('a').liveQuery('click',function(event){
  ...
  ...
  $( selector ).animate({bottom:10},'slow');
}

Мой вопрос: как мне настроить таргетинг на '.color-bar', используя $ this? Раньше каждому из них присваивался идентификатор, но потом я понял, что это излишне, и подумал, что могу сделать это, используя элемент $ this.

Я пытался $( $this > '.color-bar' ), но это не сработало. Я неправильно понимаю синтаксис или неправильно подхожу к нему? Спасибо!

Answer 1

решение

$('.color-bar', $this)

или

$(this).find('.color-bar')

примечание

.find() немного быстрее, чем первое решение, потому что первые вызовы решения все равно находятся внутри jQuery. Но выглядит немного приятнее

Answer 2

$(this).children('.color-bar').animate({bottom:10},'slow'); 

Answer 3

$(this).find('.color-bar').animate({bottom:10},'slow');