exercises/events-jq-hide.html at master · lnbailey/exercises · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>

</head>
<body>

    <div id="money">Show me the money.
      <p></p>
    </div>
    <div id="oprah">Show me the Oprah
      <p></p>
    </div>

  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.min.js"></script>

  <script>
    $('div').click(function(){
      var target = $(this).attr('id');
      if (target === 'money') {

        if ($(this).hasClass('hidden') === true) {
          $(this).removeClass('hidden');
          $(this).children('p').text('Here is the money');
        } else if ($(this).hasClass('hidden') === false) {
          $(this).addClass('hidden');
          $(this).children('p').text('');
        }
      } else {
        $(this).children('p').text('HERE IS A NEW CAR');
    }
    });
  </script>


</body>
</html>