How to Show/Hide Elements using JQuery Toggle function


You want to show/hide any HTML element using JQuery, you can use JQuery toggle function as shown in the following example:

Let's say you have a div element which you want to show/hide on button click.

<input type="button" id="btnShowHide" value="Show/Hide" onclick="ShowHide();" />
    
<div id="message">
   Hello World
</div>

You can use JQuery toggle function like this:

<script src="jquery-1.4.3.min.js" type="text/javascript"></script>
<script type="text/javascript">

   function ShowHide() {
      $("#message").toggle();
   }
        
</script>

 

 

About author


User avatar

Waqas Anwar

Founder of EzzyLearning.com, Senior Consultant, Microsoft .NET and Web Technologies

Comments