jQuery toggle()

The jQuery toggle() is a special type of method which is used to toggle between the hide() and show() method. It shows the hidden elements and hides the shown element. The jQuery toggle() method is used to show and hide the selected element. 

Syntax:
$(selector).toggle();  
$(selector).toggle(speed, callback);  
$(selector).toggle(speed, easing, callback);  
$(selector).toggle(display); 

Speed - It is an optional parameter which describe the speed of the delay to hide the current element.
Easing: It describe the easing function to be used for transition.
Callback: It is also an optional parameter. It specifies the function to be called after completion of hide() effect.
Display: If true, it displays element. If false, it hides the element.

Example of Code

<script type="text/javascript">
$(document).ready(function(){
    // Toggles paragraphs display
    $(".example-jquery-toggle-button-class").click(function(){
        $("#example-jquery-paragraph-id").toggle();
    });
});
</script>
<button type="button" class="example-jquery-toggle-button-class">Toggle Button</button> 
<p id="example-jquery-paragraph-id">you can hide and show this paragraph tag.</p>

Output