jQuery toggle();

Question

Hi

I am loading data dynamically by AJAX into a cluetip (http://plugins.learningjquery.com/cluetip/#).

I want to toggle the results from a link like so:

$(document).ready(function() {
    $("#calendarLink").live("click",( function() {
        $("#result").toggle();
    }));
});

For some reason the above will not work. Can you suggest an alternative?

Answer 1

Couple of questions/points

Do you really need to use .live() You're using an ID selector, so there should only ever be one of these.

Also, you have an extra set of brakets. Probably not a problem, but you could remove them:

$(document).ready(function() {
    $("#calendarLink").click( function() {
        $("#result").toggle();
    });
});

Answer 2

Perhaps the toggle() function isn't be used properly?

See here http://api.jquery.com/toggle/

I'm not sure if this is new functionality only for jQuery 1.4 but it appears the toggle function requires parameters.

Answer 3

The following code is correct (demo online - http://jsbin.com/ehate/edit):

$("#calendarLink").live("click", function(e){
  $("#result").toggle();
});

You use $.live() only if #calendarLink will be added dynamically later. If it isn't, use a regular click:

$("#calendarLink").click(function(e){
  $("#result").toggle();
});

If this is not working for you, be sure to check your #calendarLink and #result elements in your HTML. Make sure the ID values are correct. Mainly, be sure your casing is correct.