I'm trying to make a navigation bar that has some CSS code for the current tab and it only works for the elements that don't have a page to load.

This is my HTML code:

```
<ul class="nav-menu" id="nav-menu">
     <li>
         <a class="current" href="home">Home</a>
     </li>
     <li>
          <a href="cars">Cars</a>
     </li>
     <li>
          <a href="#">T&C</a>
     </li>
     <li>
          <a href="#">Prices</a>
     </li>
     <li>
          <a href="#">Services</a>
     </li>
     <li>
          <a href="#"">Contact</a>
     </li>
</ul>

```

And this is my jQuery code:

```
$('ul li a').click( function(){
     if ( $(this).hasClass('current') ) {
         $(this).removeClass('current');
     } else {
         $('li a.current').removeClass('current');
         $(this).addClass('current'); 
     }
});

```

As I mentioned above, for the last elements that have href="#" it works just fine, but when I press one that has a link, it just doesn't work.

Any suggestion is appreciated :)