jquery - jQuery の追加クラスが機能しない

Question

基本的に、ページが読み込まれるときに、「アクティブ」というクラスを ID #navHome に追加したいと考えています。ただし、クラスは表示されません。私の HTML 部分はインクルードなので、それが関係しているのか、それとも私が何かばかげたことをしただけなのかわかりません。

これは私が持っているものです:

HTML 部分:

<ul id="navList">
    <li><a href="index.php" title="Home" id="navHome">home</a></li>
    <li><a href="#" title="About" id="navAbout">about</a></li>
    <li><a href="portfolio.php" title="Portfolio" id="navPortfolio">portfolio</a></li>
    <li><a href="#" title="Contact" id="navContact">contact</a></li>
</ul>

CSS 部分:

.active {
    font-family: 'OpenSansBold';
    color: #3fe3ab;
    background: url('../design/images/navLiner.png') left center no-repeat;
}

jQuery 部分:

$(document).ready(function(){

$('#navHome').addClass('active');

});