Can't seem to make jQuery .not work here
<p>I've been using serialScroll's onBefore function to highlight the current scrolled selection in a navigation list, though I also want the navigation to highlight if it is hovered over. This works, except when the mouse leaves the area. Then all styles are stripped from it. </p>

<p>I tried adding a class to the current nav item, and using .not to make sure the highlighted nav item doesn't get its style stripped, though this isn't working. </p>

<p>Code is as below:</p>

<pre><code>onBefore: function(){
            $('#selector ul li').eq($counter).find('a').css({color: '#d5d5d6'});

            if($counter == 3){
                $counter = 0;   
            } else {
                $counter++;
            }

            if($counter == 0){
                $('#selector ul li').eq($counter).find('a').css({color: '#666666'}).addClass('highlighted');
            }
            if($counter == 1){
                $('#selector ul li').eq($counter).find('a').css({color: '#55b447'}).addClass('highlighted');
            }
            if($counter == 2){
                $('#selector ul li').eq($counter).find('a').css({color: '#2685c7'}).addClass('highlighted');
            }
            if($counter == 3){
                $('#selector ul li').eq($counter).find('a').css({color: '#f6db0a'}).addClass('highlighted');
            }

        }

});




    });

    // Hover Selector links to respective color

    $('#selector ul li').eq(0).not('.highlighted').find('a').hover(
        function(){
        $(this).css({color: '#666666'});
    },
        function() {
        $(this).css({color: '#d5d5d6'});
        }
    );

    $('#selector ul li').eq(1).not('.highlighted').find('a').hover(
        function(){
        $(this).css({color: '#55b447'});
    },
        function() {
        $(this).css({color: '#d5d5d6'});
        }
    );

    $('#selector ul li').eq(2).not('.highlighted').find('a').hover(
        function(){
        $(this).css({color: '#2685c7'});
    },
        function() {
        $(this).css({color: '#d5d5d6'});
        }
    );

    $('#selector ul li').eq(3).not('.highlighted').find('a').hover(
        function(){
        $(this).css({color: '#f6db0a'});
    },
        function() {
        $(this).css({color: '#d5d5d6'});
        }
    );
</code></pre>
