jQuery Toggle method function


jquery jQuery Toggle method function Jquery Functions

How to Show and Hide the HTML tag or element using jQuery function with single button?

Some time we have need toggle button that turns on and off the display of the HTML element.

  • If Showed then hide it.
  • If hidden then show it.

Syntax of jQuery toggle function

$("TagSelector").toggle(); Let us discuss the example of jQuery toggle function.

On single button Show and Hide the paragraph with id="description"

First we will access the paragraph with id="description" and then use the toggle() function to hide and show the paragraph

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <button> Toggle Button </button> <p id="description">Courtesy is as much a mark of a gentleman as courage.</p> <script type="text/javascript"> $("button").click(function() { $("#description").toggle(); }); </script>

Courtesy is as much a mark of a gentleman as courage.

jquery Jquery Functions Chapter Next »