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>

🙂

Leave a Reply

Your email address will not be published. Required fields are marked *

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>

🙂

Leave a Reply

Your email address will not be published. Required fields are marked *