codeup-web-exercises/parks.html at main · WilliamsBrit/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
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Parks</title>

</head>
<body>

<h1>National Parks FAQ</h1>
<div id="fun-facts">
    <button id="btn1">Button 1</button>

    <h3>Superbad State Park</h3>
    <ul>
        <li>Total recreation visitors to the national parks in 2018: 318,211,833.</li>

        <li>The National Park Service was created by an act signed by President Woodrow Wilson on August 25, 1916.</li>

        <li>Permanent, temporary, and seasonal employees: More than 20,000</li>

        <li>The arrowhead was authorized as the official National Park Service emblem by the Secretary of the Interior
            on July 20, 1951.
        </li>
    </ul>
</div>

<div id=fun-facts2">
    <h3> Lollilop Lane State Park</h3>
    <ul>
        <li>The system includes 419 areas covering more than 85 million acres in every state, the District of Columbia,
            American Samoa, Guam, Puerto Rico, and the Virgin Islands.
        </li>

        <li>Wrangell-St. Elias National Park and Preserve, AK, at 13.2 million acres.</li>

        <li>Fiscal Year (FY) 2014 Enacted: $2.98 billion.</li>

        <li>Some national parks welcome pets—in developed areas, on many trails and campgrounds, and in some lodging
            facilities.
        </li>
    </ul>
</div>

<div id="fun-facts3">
    <h3>Santa Clause State Park</h3>
    <ul>
        <li>National Park Service jobs, including both permanent and seasonal positions, are listed on USAJOBs.</li>

        <li>Before you head out, check with the national parks that you intend to visit. In many national parks,
            off-road driving is illegal. Where off-road driving is allowed, the National Park Service regulates it.
        </li>

        <li> Christmas ceremonies start at 6pm every day in December.</li>

        <li>Rudolph takes photos with children every other Saturday.</li>
    </ul>

</div>
<script>
    "use strict";
    const button1 = document.getElementById("btn1");
    const listItems = document.querySelectorAll("ul");

    const listener = () => {
        for (let item of listItems) {
            item.lastElementChild.style.backgroundColor = "yellow"
        }
    }
    button1.addEventListener("click", listener)
    // ------------------------------------------------------------------------------------
    const fontSize = document.querySelectorAll('h3')
    fontSize.forEach(element => {
        element.addEventListener("click", () => {
            const sibling = element.nextElementSibling;
            if (sibling) {
                sibling.style.fontWeight = "bold";
            }
        });
    });
//     ------------------------------------------------------------------------------------
    const fontColor = document.querySelectorAll('li')
    for(let element of fontColor) {
        element.addEventListener("click", () => {
            element.parentElement.firstElementChild.style.color = "blue";
        });
    }

</script>

</body>
</html>