Question: I have some jQuery code that runs when an item with a certain ID is clicked on. It's working when the ID is part of an `<li>` element, but not when it's in an `<a>` element. Why would this be? I'd like to use an as it allows me to achieve some stuff if the user has JavaScript turned off.

**EDIT:** Neither preventdefault or return false seem to make any difference.

HTML and Code below:

```
<li><a id="OfficeNav-Bath" class="first" href="#bath">Bath</a></li>

```

**EDIT:** It works if there's no HREF specified in the `<a>` element.

```
$(function() {
    $("#OfficeNav-Bath").click(function(){
        $('.office').removeClass('visible');
    });             
});

```

Any idea why this would be? Thanks in advance.

Answer: 
i think you are not preventing the default event when using with `<a>` tags, so try doing:

```
$(function() {
   $("#OfficeNav-Bath").click(function(e){
     e.preventDefault();
     $('.office').removeClass('visible');
   });           
});

```
When an anchor element is clicked the browser tries to navigate to the URL to which the anchor's `href` attribute points.

It's possible to override this behaviour using the method `preventDefault` on the `event` object that the event handler receives as paramenter.

```
$("#OfficeNav-Bath").click(function(event){
    event.preventDefault();
    ...
});  

```