jQuery hide()

Education is not limited to just classrooms. It can be gained anytime, anywhere... - Ravi Ranjan (M.Tech-NIT)

jQuery hide()

The jQuery hide() method is used to hide the selected elements.

Syntax:

 
  1. $(selector).hide();  
  2. $(selector).hide(speed, callback);  
  3. $(selector).hide(speed, easing, callback);  

speed: It is an optional parameter. It specifies the speed of the delay. Its possible vales are slow, fast and milliseconds.

easing: It specifies 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.

Let's take an example to see the jQuery hide effect.

 
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>  
  5. <script>  
  6. $(document).ready(function(){  
  7.     $("#hide").click(function(){  
  8.         $("p").hide();  
  9.     });  
  10. });  
  11. </script>  
  12. </head>  
  13. <body>  
  14. <p>  
  15. <b>This is a little poem: </b><br/>  
  16. Twinkle, twinkle, little star<br/>  
  17. How I wonder what you are<br/>  
  18. Up above the world so high<br/>  
  19. Like a diamond in the sky<br/>  
  20. Twinkle, twinkle little star<br/>  
  21. How I wonder what you are  
  22. </p>  
  23. <button id="hide">Hide</button>  
  24. </body>  
  25. </html>  

Test it Now

Output:

This is a little poem: 
Twinkle, twinkle, little star
How I wonder what you are
Up above the world so high
Like a diamond in the sky
Twinkle, twinkle little star
How I wonder what you are