codeup-web-exercises/jQuery_faq_exercise.html at main · coleausher/codeup-web-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
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>jQuery FAQ Exercise</title>
    <style>
        .invisible{
            visibility: hidden;
        }
        .highlight{
            background-color: yellow;
        }
    </style>
</head>
<body>
<h1>US National Parks FAQ</h1>

<dl>
    <dt>Abraham Lincoln Birthplace
        National Historical Park</dt>
    <dd>Situated in rural central Kentucky, the Abraham Lincoln Birthplace National Historical Park is the first memorial to honor our 16th president.</dd>

    <dt>Acadia National Park</dt>
    <dd>The first national park east of the Mississippi River, Acadia National Park offers hiking, biking, camping, breathtaking views of jagged coastlines, and pristine lakes.</dd>

    <dt>Adams National Historical Park</dt>
    <dd>Learn about America's history through the eyes of John Adams and his family.
        Opportunity abounds for history and nature buffs alike at this Massachusetts park.</dd>

    <dt>African American Civil War
        Memorial</dt>
    <dd>Remember and honor the African-American soldiers and sailors of the Civil War at this historic memorial in Washington, D.C.</dd>

    <dt>African Burial Ground National
        Monument</dt>
    <dd>This monument in Manhattan honors
        African Americans and offers an education on the hardship they endured in early
        America.</dd>

    <dt>Agate Fossil Beds National
        Monument</dt>
    <dd>Located in the northwest corner of Nebraska, Agate Fossil Beds National Monument features Miocene-age rocks containing an excellent fossil record.</dd>

    <dt>Ala Kahakai National Historic
        Trail</dt>
    <dd>Established in 2000 for the preservation, protection, and interpretation of traditional Native Hawaiian culture and natural resources, Ala Kahakai offers visitors a trail network of cultural and historical significance to explore.</dd>

    <dt>Alagnak Wild River</dt>
    <dd>Whitewater rafting in Class I-IlI rapids, kayaking, fishing, and floating are some of the activities enjoyed by adventure-seekers on vacation in Alaska.</dd>

    <dt>Alcatraz Island</dt>
    <dd>Come to Alcatraz for a prison tour while enjoying the historical and cultural experiences unique to the San Francisco
        Bay.</dd>

    <dt>Alibates Flint Ouarries National
        Monument</dt>
    <dd>Alibates Flint Ouarries National Monument is protected by the National Park Service and is the only National Monument in Texas.</dd>

    <dt>Allegheny Portage Railroad
        National Historic Site</dt>
    <dd>History buffs, train enthusiasts, and National Park Foundation supporters wander this Pennsylvania historic site to learn about our nation's railroad history.</dd>
</dl>

<button id="toggle">click me</button>


<!--Traversing Methods Exercise-->
<h3>BIG BEND NATIONAL PARK</h3>
<ul>
    <li>The park is named Big Bend after the Rio Grande River’s big bend in west Texas (The Rio Grande flows through the park).</li>
    <li>About 118 miles of the Park border runs along the international border between the United States and Mexico.</li>
    <li>There are some surprising geological features in the park, including sea fossils dinosaur bones, and volcanic dikes.</li>
    <li>Big Bend has more than 1,200 species of plants, including 60 species of cactus.</li>
</ul>
<h3>SEQUOIA NATIONAL PARK</h3>
<ul>
    <li>Sequoia was the first park created to protect a living organism.</li>
    <li>Sequoia is home to the tallest mountain in the lower 48</li>
    <li>Sequoias are some of the largest and oldest trees in the world. </li>
    <li>The parks have over 800 miles of trails.</li>
</ul>
<h3>SAN ANTONIO MISSIONS NATIONAL PARK</h3>
<ul>
    <li>San Antonio Missions National Historical Park is the nation’s largest collection of Spanish colonial resources.</li>
    <li>Missions Concepción, San José, San Juan and Espada are all active Catholic parishes that hold regular services.</li>
    <li>The missions weren't just churches in the 18th century, they were self-sustaining towns.</li>
    <li>The current water rights for two of San Antonio's Spanish acequias, the San Juan Ditch Water Corp and the Espada Ditch Comp, were granted in 1731.</li>
</ul>

<button id="button">Click Me</button>


<script src="https://code.jquery.com/jquery-3.6.4.js" integrity="sha256-a9jBBRygX1Bh5lt8GZjXDzyOB+bWve9EiO7tROUtj/E=" crossorigin="anonymous"></script>
<script>


  let dd = $("dd")
    dd.click(function (){
        $(this).addClass("invisible")
    });

    $("#toggle").click(function (){
        $("dd").toggleClass("invisible")
    });

    let dt = $("dt")
  dt.click(function (){
      $(this).addClass("highlight")
  });


//Traversing Methods Exercise

let list = $("li")

  $('#button').click(function() {

      $('ul').each(function() {
          $(this).children('li').last().css('background-color', 'yellow');

      });
  });


  $('h3').click(function() {

      $(this).next('ul').children('li').css('font-weight', 'bold');

  });


  $('li').click(function() {

      $(this).parent().children('li').first().css('color', 'blue');

  });

</script>
</body>
</html>