My Nav buttons don't highlight when I select them?

in your stylesheet you have a few pseudo classes you can change for your anchor elements, something like this:

a :hover{ color: #333; }

the others are: a :link{} a :visited{}

this should do the trick, if not check syntax :)

Here are some selectors that may help you.

/* unvisited link */
a:link    {
    color: green;
}

/* visited link */
a:visited {
    color: green;
}

/* mouse over link */
a:hover   {
    color: red;
}

/* selected link */
a:active  {
    color: yellow;
}

There are of course several ways to skin that cat but most often people use jQuery to compare the current URL you are at in your browser with the URL you have in your <a> tag in the <li> link that you clicked.

Here is a quick and dirty example

   $(document).ready(function () {
      var url = window.location;
      $('.nav li a').each(function () {
          if (this.href == url) {
            $('.nav').find('.active').removeClass('active');
            $(this).parent().addClass('active');
          }
      }); 
  });

Taken in a line by line basis we have the following:

  $(document).ready(function () {
      var url = window.location;

This is saying when the document loads take the current URL and store it in the variable called url.

$('.nav li a').each(function () {
          if (this.href == url) {
            $('.nav').find('.active').removeClass('active');
            $(this).parent().addClass('active');

This last block is the meat and potatoes of the jQuery script. it is saying go though each <a> tag in the navigation list, if the any of them are the same as the URL stored in the url variable remove the .active class wherever it is and apply to this <li>.

Like I said, this a quick and dirty way I came up with at 2am. I am sure there are more elegant and cleaner ways to get it done :) but hopefully this gives you the jest of what I am talking about.

Here are some other ways:

css-tricks.com

an itWorld write up

GRAYBOX

and one from Jessie's

I hope this helps!