Javascript 可能是一个简单的jQuery选择器问题

我现在有一些在点击链接时执行的代码。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>

我的问题是如何使用$this定位特定的“.color bar”？之前，我给每个人都分配了一个id，但后来意识到这太过分了，我想我可以使用$this元素来完成

我尝试了

$（$this>'.color bar'）

，但没有成功。我是不是只是语法有误，还是理解有误？谢谢

解决方案 或

笔记

---

.find（）

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

你想要一个带有一类.color条的a标签吗？为了它的价值，我倾向于使用第二种形式——我的大脑发现它更容易理解，因此更易于维护，它总是以类似/相同的结果解决方案获胜。

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

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

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

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

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