diff --git a/about.html b/about.html
new file mode 100644
index 0000000..fd7d104
--- /dev/null
+++ b/about.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>About Me</title>
+  </head>
+  <body>
+    <ul>
+      <li><span id="nickname">Nickname: booboo</span></li>
+      <li><span id="favorites">Favorites: music, pizza, The Office</span></li>
+      <li><span id="hometown">Hometown: Wilmington</span></li>
+      <li>
+        <span id="randomFact">Random Fact: Black is my favorite color.</span>
+      </li>
+    </ul>
+    <script src="./main.js"></script>
+  </body>
+</html>
diff --git a/fruitandveg.html b/fruitandveg.html
new file mode 100644
index 0000000..ff55d57
--- /dev/null
+++ b/fruitandveg.html
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Fruits and Vegetables</title>
+  </head>
+  <body>
+    <div id="firdiv">
+      <h3>Table of Contents</h3>
+    </div>
+    <hr />
+
+    <div id="secdiv">
+      <h1>Fruits</h1>
+      <h2>Red Fruits</h2>
+      <h3>Apple</h3>
+      <h3>Raspberry</h3>
+      <h2>Orange Fruits</h2>
+      <h3>Orange</h3>
+      <h3>Tangerine</h3>
+      <h1>Vegetables</h1>
+      <h2>Vegetables Which Are Actually Fruits</h2>
+      <h3>Tomato</h3>
+      <h3>Eggplant</h3>
+    </div>
+
+    <script>
+      /*
+      3. Add a script to the HTML document that iterates through the elements and creates a table 
+      of contents. The table of contents should be at the top of the webpage. 
+      */
+
+      let textTOC = "";
+
+      let headerlength = document
+        .getElementById("secdiv")
+        .getElementsByTagName("h2").length;
+
+      for (let i = 0; i < headerlength; i++) {
+        const getHeader = document
+          .getElementById("secdiv")
+          .getElementsByTagName("h2")[i].textContent;
+        document
+          .getElementById("secdiv")
+          .getElementsByTagName("h2")
+          [i].setAttribute("id", "point" + i);
+        textTOC = "<li><a href='#point" + i + "'>" + getHeader + "</a></li>";
+        document.getElementById("firdiv").innerHTML += textTOC;
+      }
+    </script>
+  </body>
+</html>
diff --git a/img/Myphoto.JPG b/img/Myphoto.JPG
new file mode 100644
index 0000000..e517daf
Binary files /dev/null and b/img/Myphoto.JPG differ
diff --git a/js-dom.html b/js-dom.html
new file mode 100644
index 0000000..6f57bdd
--- /dev/null
+++ b/js-dom.html
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Document</title>
+  </head>
+  <body>
+    <p id="firstParagraph"></p>
+    <p id="secondParagraph"></p>
+
+    <button onclick="removeImage()">Remove Image</button>
+
+    <script>
+      let firstText = document.querySelectorAll("p");
+
+      // Write a script to add "We are coders!" to the `<p>` element.
+      for (let i = 0; i < firstText.length; i++) {
+        firstText[i].textContent = "We are coders!";
+      }
+
+      //Find the *first* `<p>` element and change its text to "Developers for life!"
+      let secondText = document.getElementById("firstParagraph");
+      secondText.innerHTML = "Developers for life!";
+
+      //Add an image to the HTML document using DOM methods
+      let x = document.createElement("img");
+      x.setAttribute("src", "./lib/images/laptop.svg");
+      x.setAttribute("width", "304");
+      x.setAttribute("height", "228");
+      x.setAttribute("alt", "laptop");
+      document.body.appendChild(x);
+
+      //Write a script to change the color of the text from black to your favorite color
+      let bodyText = document.querySelectorAll("body");
+      for (let i = 0; i < bodyText.length; i++) {
+        bodyText[i].style.color = "tomato";
+      }
+
+      //Add a script to change the font size of the first `<p>` element to `40px`
+      document.getElementById("firstParagraph").style.fontSize = "40px";
+
+      //Add a script that hides the image when the button is clicked
+      function removeImage() {
+        var elmnt = document.getElementsByTagName("img");
+        elmnt[0].style.display = "none";
+      }
+    </script>
+  </body>
+</html>
diff --git a/main.js b/main.js
new file mode 100644
index 0000000..fef4ace
--- /dev/null
+++ b/main.js
@@ -0,0 +1,24 @@
+// Change the body style so it has a `font-family` of `Arial, sans-serif`.
+document.querySelector("body").style.fontFamily = "Arial, sans-serif";
+
+//Replace each of the values with your own information.
+document.getElementById("nickname").textContent = "Nickname: cayenne pepper";
+document.getElementById("favorites").textContent =
+  "Favorites: music, cheesecake, The Office";
+document.getElementById("hometown").textContent = "Hometown: New Castle";
+document.getElementById("randomFact").textContent =
+  "Random Fact: Red is my favorite color.";
+
+//Change the `<li>` style to a color of your choosing. Cannot be black.
+let liText = document.querySelectorAll("li");
+for (let i = 0; i < liText.length; i++) {
+  liText[i].style.color = "#0E497C";
+}
+
+let x = document.createElement("img");
+x.setAttribute("src", "./img/Myphoto.JPG");
+x.setAttribute("width", "304");
+x.setAttribute("height", "228");
+x.setAttribute("alt", "photo of me");
+document.body.appendChild(x);
+
