Active class for navigation not working

I'm hoping someone can help me on an issue I'm having with getting the active nav button to show when on the page. Here is the code I'm using. What do I have wrong? This is my first go-around with this, so any help would be appreciated. I don't want to learn includes for this simple site, so I'm just coding per page.

CSS

#sddm

{          margin: 0;

          padding: 0;

          z-index: 30}

#sddm li

{

          margin: 0;

          padding: 0;

          list-style: none;

          float: left;

          font: 13px arial;

          }

#sddm li.active

{

          background: #0075c1;

          color: #FFF;

          visibility: visible;

}

#sddm li a

{          display: block;

          margin: 0 0 0 0;

          padding-top: 8px;

          width: 154px;

          height: 20px;

          background: #666666;

          color: #FFF;

          text-align: center;

          text-decoration: none}

#sddm li a:hover

{          background: #0075c1;

color: #FFF}

HTML

<ul id="sddm">

    <li class="active"><a href="index.html">Home</a></li>

and so on...

Thanks so much!