اکتیو منو کار نمیکنه

با سلام . میخوام هربار منویی رو انتخاب میکنم ،اون منو اکتیو بودنش با css مشخص بشه.
این ها رو نوشتم کار نمیکنه :

کد HTML:

---

<nav id="mainav" class="fl_right">      <ul class="clear" id="menuhead">        <li class="active"><a href="posts">خانه</a></li>        <li><a href="about">درباره من</a></li>        <li><a href="learning">کلاسهای آموزشی</a></li>        <li><a href="contact">تماس با من</a></li>      </ul></nav>

---

jQuery(document).ready(function($) {

    $('ul#menuhead > li > a').each(function () {            

        if (window.location.pathname.indexOf($(this).attr('hr  ef')) > -1) {

            $(this).closest('li').addClass('active');

            return false;

        }

    });

});

اینو هم تست کردم جواب نداد :

jQuery(document).ready(function($) {





$('#menuhead li').each(function(){

    if(window.location.href.indexOf($(this).find('a:fi  rst').attr('href'))>-1)

    {

    $(this).addClass('active').siblings().removeClass(  'active');

    }

});

});

و کد css:

#mainav li a{color:inherit; border-color:transparent;margin-right:10px}

#mainav .active a{border-color:#EE6D00; background-color:#099}

#mainav .active a, #mainav a:hover, #mainav li:hover > a{color:#EE6D00; background-color:inherit;}

#mainav li li a, #mainav .active li a{color:#FFFFFF; background-color:rgba(0,0,0,.6); border-color:rgba(0,0,0,.6);}

#mainav li li:hover > a, #mainav .active .active > a{color:#FFFFFF; background-color:#FF8D2C;}