jquery - Show a div only when a button clicked -


how can show div on button click, , hide otherwise?

i have button show:

<script>  $("#show").click(function(){         $("#content").show();     }); }); </script>  <div class="content">content of div</p>  <button id="show">show</button> 

i suggest use toogle() instead of show() , hide().

and put code in ready().

if don't want show start, use display : none or visibility: hidden; property.

<!doctype html>  <html>  <head>  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>  <script>  $(document).ready(function(){      $("button").click(function(){          $("div").toggle();      });  });  </script>  </head>  <body>    <div style = "display: none;">this div.</div>    <button>toggle between hide() , show()</button>    </body>  </html>


Comments