highlighted current page not going current page

Question

Hi

I have a piece of code that removes and add class 'selected' when the link is clicked on the navigation. The problem I have is that when you click the link it doesn't actually go to the page.

Can any anyone help?

  $(document).ready(function () {

  $("li:first").addClass("selected");
   $("li:last").addClass("last");

    $("#nav li").click(function () {
   $('li').removeClass("selected");
   $(this).addClass("selected");
 return false;    
    });

    });

  </script>


  <div id="nav">
  <ul>
  <li><a href="main.php">Home</a></li>
  <li><a href="javascript:play();">Play Now</a></li>
  <li><a href="promotions.php">Promotions</a></li>
  <li><a href="ourgames.php">Our Games</a></li>
  <li><a href="community.php">Community</a></li>
  <li><a href="help.php">Help</a></li>
 </ul>
  </div>

Answer 1

try removing return false;

Answer 2

To prevent from going to the page you can call in the click callback function event.preventDefault() or return false.

In your example you say you want to execute what is in the callback and go to the page. Maybe you can try to return true.

But when you go to the new page the 'selected' class added to the 'a' element will be lost.