Tutorials References Menu

jQuery toggle() Method

❮ jQuery Event Methods

Example

Toggle between colors when clicking on a <p> element:

$("p").toggle(
  function(){$("p").css({"color": "red"});},
  function(){$("p").css({"color": "blue"});},
  function(){$("p").css({"color": "green"});
});
Try it Yourself »

Definition and Usage

The toggle() method was deprecated in jQuery version 1.8, and removed in version 1.9.

The toggle() method attaches two or more functions to toggle between for the click event for the selected elements.

When clicking on an element, the first specified function fires, when clicking again, the second function fires, and so on.

Note: There is also a jQuery Effects method called toggle(). Which one is called, depends on the parameters.


Syntax

$(selector).toggle(function)

Parameter Description
function Required. A function to run every time the selected element is clicked

Try it Yourself - Examples

Toggle between multiple functions
How to toggle between multiple functions.


❮ jQuery Event Methods