可能是简单的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');
}

我的问题是如何使用$ this定位特定的'.color-bar'？在我为每个人分配了一个id之前，但后来意识到它是矫枉过正的，并认为我可以使用$ this元素来完成它。

我尝试了$( $this > '.color-bar' )但是没有用。我只是语法错误或接近错误吗？谢谢！

Answer 1

溶液

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

或

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

注释

.find()比第一个解决方案快一点，因为第一个解决方案在jQuery中内部调用find。但它看起来更漂亮

Answer 2

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

Answer 3

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