如何使用javascript突出显示活动菜单？

我使用下面的脚本突出显示twitter引导中的活动菜单

/* This is cool it sets the right navbar element active */
$(document).ready(function () {
    $('a[href="' + this.location.pathname + '"]').parent().addClass('active');
});

上述脚本使用的引导html如下所示：

<ul class="nav navbar-nav navbar-right">

    <li><a href="/">Home</a></li>
    <li> <a href="/about/">About</a></li>
    <li> <a href="/articles/">Articles</a></li>

</ul>

http://192.168.0.100:8001/about/
http://192.168.0.100:8001/articles/
http://192.168.0.100:8001/articles/cars/

它工作得很好，文章菜单项突出显示

但是，如果url为，请说明：

example.com/articles/cars
example.com/articles/cars/
example.com/articles/cars/mini

它不再将“文章”菜单项设置为活动

有什么办法可以让它设置菜单项活跃的儿童文章呢

**更新**

我目前在一个开发框中，我的URL如下所示：

<ul class="nav navbar-nav navbar-right">

    <li><a href="/">Home</a></li>
    <li> <a href="/about/">About</a></li>
    <li> <a href="/articles/">Articles</a></li>

</ul>

http://192.168.0.100:8001/about/
http://192.168.0.100:8001/articles/
http://192.168.0.100:8001/articles/cars/

---

只需使用“^=”选择器：”[href^=“”+this.location.pathname+”]”我试过了，但没有成功。无论如何，谢谢你。