Cycle Plug-In: Pager Active CSS Class Not Working

Cycle Plug-In: Pager Active CSS Class Not Working

I'm absolutely stumped here. I'm using the cycle plug-in with an existing nav bar (2 buttons). It functions correctly -- but for some reason -- I can't get the corresponding nav button to change CSS class and show as highlighted. Any ideas?

jQuery:
  1. $(document).ready(function() {
  2. $('#slideShow').cycle({
  3. fx: 'fade',
  4. activePagerClass: 'active',
  5. pager:  '#featureNav',
  6. pagerAnchorBuilder: function(idx, slide) {
  7. return '#featureNav li:eq(' + idx + ') a';
  8. } 
  9. });
  10. });

HTML:
  1. <div id="featureHome">
  2. <div id="slideShowContainer">
  3. <div id="slideShow">
  4. <img src="images/image.jpg" alt="" height="220" width="698" border="0" />
  5. <img src="images/image.jpg" alt="" height="220" width="698" border="0" />
  6. </div>
  7. </div>
  8. <ul id="featureNav">
  9. <li><a href="#" title="">Button 1</a></li>
  10. <li class="last"><a href="#" title="">Button 2</a></li>
  11. </ul>
  12. </div>

CSS:
  1. #featureNav  {
  2. background-image: url("../images/feature_nav_back.png");
  3. background-repeat: no-repeat;
  4. list-style-type: none;
  5. margin: 0;
  6. padding: 0 0 4px 5px;
  7. position: absolute;
  8. z-index: 9998;
  9. top: 207px;
  10. left: 0;
  11. width: 709px;
  12. height: 43px
  13. }

  15. #featureNav li  {
  16. float: left
  17. }

  19. #featureNav li a  {
  20. color: #666;
  21. font-size: 14px;
  22. font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;
  23. font-weight: bold;
  24. line-height: 14px;
  25. text-decoration: none;
  26. text-align: center;
  27. text-transform: uppercase;
  28. display: block;
  29. margin: 0 1px 0 0;
  30. padding: 20px 0 0;
  31. width: 354px;
  32. height: 24px
  33. }

  35. #featureNav li.last a {
  36. margin-right: 0
  37. }

  39. #featureNav li a:hover  {
  40. color: #fff;
  41. background-image: url("../images/feature_btn_back_over.png");
  42. background-repeat: no-repeat
  43. }

  45. #featureNav li a.active  {
  46. color: #fff;
  47. background-image: url("../images/feature_btn_back_over.png");
  48. background-repeat: no-repeat
  49. }