jQuery .toggle() not working

The code:

$(document).ready(function() {  
    $('#new_opt').click(function() {  
        $('#reg_form').toggle('slow');  
    });  
}); 

Using Firefox.

First time I click, it shows, but then it doesn't hide when I click after that.

CSS:

#reg_form - display: none;

If it helps -

#new_opt - cursor: pointer;

When I click the first time the cursor is pointer and it shows but after that the cursor doesn't become a开发者_开发百科 pointer too. weird.

Try this:

$(document).ready(function() {  
    $('#reg_form').hide();
    $('#new_opt').click(function() {  
        $('#reg_form').toggle('slow');  
    });  
}); 

and remove that CSS.

The problem was that the div(#reg_form) that was loading had some part of it covering the #new_opt div hence the cursor not changing to a pointer and the toggle() not working.