jquery show hide

1
2$("#hide").click(function(){
3  $("p").hide();
4});
5
6$("#show").click(function(){
7  $("p").show();
8}); 

1
2  $(document).ready(function() {
3    $("#btnshow").click(function() {
4      $("#imgshow").slideToggle();
5    });
6  })
7

1<div id="main"> 
2  <p> Hide/show this div </p>
3</div>
4
5('#main').hide(); //to hide
6
7// 2nd way, by injecting css using jquery
8$("#main").css("display", "none");

1$("#demo").hide();      // sets to display: none
2$("#demo").show(200);   // shows hidden elemnt with animation (speed)
3$("#demo").toggle();    // toggle between show and hide
4
5$( "#element" ).hide( "slow", function() {  // hide with callback function
6console.log( "Animation complete." );
7});
8

1jQuery(document).ready(function() {
2  // Hide the extra content initially, using JS so that if JS is disabled
3  jQuery('.rmContent').addClass('rmHide');
4
5  // Set up the toggle.
6  jQuery(".rmToggle").on("click", function() {
7    jQuery(this).nextAll(".rmContent").toggleClass("rmHide");
8  });
9
10  jQuery("#showAbout").text("Show More").click(function(e) {
11    e.preventDefault();
12    jQuery(this).text(jQuery(this).text() == " Show Less ↑" ? " Show More ↓" : " Show Less ↑");
13  });
14
15});