​x
 
1
<!DOCTYPE html>
2
<title>My Example</title>
3
​
4
<style>
5
  p {
6
    background: gold;
7
    padding: 20px;
8
  }
9
</style>
10
​
11
<!-- Load jQuery -->
12
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
13
​
14
<!-- Use jQuery -->
15
<script>
16
// Wait for DOM to load and be ready
17
$(document).ready(function(){
18
  
19
  // Click event handler for the 'hide' button
20
  $("#hideContent").click(function() {
21
  
22
    // Hide the element
23
    $( "p" ).hide();
24
    
25
  });
26
​
27
  // Click event handler for the 'show' button
28
  $("#showContent").click(function() {
29
  
30
    // Show the element
31
    $( "p" ).show();
32
    
33
  });
34
​
35
});
36
</script>
37
<button id="hideContent">Hide</button>
38
<button id="showContent">Show</button>
39
<p>Look at me!</p>