Как добавить активную ссылку динамически с JQuery

У меня есть <nav>, содержащий мои ссылки на моей странице. Это выглядит так:

<nav>
    <ul>
        <li><a href="index.htm">Home</a></li>
        <li><a href="#">About</a></li>
        <li><a href="#">Portfolio</a></li>
        <li><a href="#">Contact</a></li>
    </ul>
</nav>

Я пытаюсь динамически добавлять .active класс к родительскому (li). ссылки, используя некоторый jQuery. Это выглядит так:

$(function() {
    $("nav a").each(function() {
        var hreflink = $(this).attr("href");
        if (hreflink.toLowerCase()==location.href.toLowerCase()) {
            $(this).parent("li").addClass("active");
        }
    });
}); 

Я считаю, что причина этого в том, что моя переменная hreflink возвращает что-то вроде этого: index.htm и location.href.toLowerCase() возвращает это: file:///c: /personal/theme/index.htm

Я предполагаю, что есть лучший способ сделать это. Кто-нибудь сможет помочь? Благодарю!