jQuery Hide & Show Toggle – An Example

By | April 28, 2011

Hi,

Want to try out a simple hide and show toggle using jQuery? The example given below shows how you can simply hide and show a paragraph in html using jQuery. Try it out!

<html>
<head>

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

<script type="text/javascript">

$(document).ready(function(){

  $("#hideMe").click(function(){
    $("p").hide();
  });

  $("#showMe").click(function(){
    $("p").show();
  });

});

</script>

</head>

<body>
<p>Coderz Heaven! Click 'HideMe' for hiding! Click 'ShowMe' for showing</p>
<button id="hideMe">HideMe</button>
<button id="showMe">ShowMe</button>
</body>
</html>

🙂

One thought on “jQuery Hide & Show Toggle – An Example

  1. Celena Kezar

    Simply want to say your article is as surprising. The clarity in your post is just spectacular and i can assume you are an expert on this subject. Well with your permission let me to grab your RSS feed to keep up to date with forthcoming post. Thanks a million and please carry on the enjoyable work.

    Reply

Leave a Reply

Your email address will not be published.