diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000..fdabad2
Binary files /dev/null and b/.DS_Store differ
diff --git a/.vscode/.DS_Store b/.vscode/.DS_Store
new file mode 100644
index 0000000..5008ddf
Binary files /dev/null and b/.vscode/.DS_Store differ
diff --git a/4/sayhello.html b/4/sayhello.html
index f7c0703..31754f1 100644
--- a/4/sayhello.html
+++ b/4/sayhello.html
@@ -1,11 +1,11 @@
-<html><body><script>
-function sayHello(name){
-    return `Hello ${name}, it is good to see you.`
-}
-let a = sayHello("jon".toLocaleUpperCase())
-
-console.log(a)
-// sayHello("meli")
-// sayHello("sammie")
-// sayHello("lucy")
+<html><body><script>
+function sayHello(name){
+    return `Hello ${name}, it is good to see you.`
+}
+let a = sayHello("jon".toLocaleUpperCase())
+
+console.log(a)
+// sayHello("meli")
+// sayHello("sammie")
+// sayHello("lucy")
 </script></body></html>
\ No newline at end of file
diff --git a/5/function.html b/5/function.html
index a69c380..94fb140 100644
--- a/5/function.html
+++ b/5/function.html
@@ -1,6 +1,7 @@
-<html><body><script>
-function sayHi() {
- console.log("Hi!");
-}
-setTimeout(sayHi, 2000);
+<html><pre id="log"></pre><body><script>
+!function(){var n=document.getElementById("log");console.log=function(){for(var i=0;i<arguments.length;i++)"object"==typeof arguments[i]?n.innerHTML+=(JSON&&JSON.stringify?JSON.stringify(arguments[i],void 0,2):arguments[i])+"<br />":n.innerHTML+=arguments[i]+"<br />"}}();
+function sayHi() {
+ console.log("Hi!");
+}
+setTimeout(sayHi, 2000);
 </script></body></html>
\ No newline at end of file
diff --git a/5/functioncalledcallback.html b/5/functioncalledcallback.html
index 6e9474f..e2cf66e 100644
--- a/5/functioncalledcallback.html
+++ b/5/functioncalledcallback.html
@@ -1,19 +1,19 @@
-A function with no parameters that prints how many times it’s
-been called. Hint: define a variable outside of the function to
-keep track of the number of calls, like we did in the “Side
-Effects” section on page 77.
-<html><body><script>
-let a = 0
-let b = 0
-let c = 0
-
-function calledcallback (){a++;console.log(`calledcallback calls: ${a}`)}
-
-callback = function () {b++;console.log(`callback calls: ${b}`)}
-
-cb = () => {c++;console.log(`cb calls: ${c}`)}
-
-calledcallback()
-callback()
-cb()
+A function with no parameters that prints how many times it’s
+been called. Hint: define a variable outside of the function to
+keep track of the number of calls, like we did in the “Side
+Effects” section on page 77.
+<html><body><script>
+let a = 0
+let b = 0
+let c = 0
+
+function calledcallback (){a++;console.log(`calledcallback calls: ${a}`)}
+
+callback = function () {b++;console.log(`callback calls: ${b}`)}
+
+cb = () => {c++;console.log(`cb calls: ${c}`)}
+
+calledcallback()
+callback()
+cb()
 </script></body></html>
\ No newline at end of file
diff --git a/5/functiondate.html b/5/functiondate.html
index 37319fb..7f47c79 100644
--- a/5/functiondate.html
+++ b/5/functiondate.html
@@ -1,11 +1,11 @@
-A function that prints the current date and time. Hint: you can
-get the current date and time with new Date().
-<html><body><script>
-function datetime (){let t = Date();console.log(t)}
-date = function () {let t = Date();console.log(t)}
-d = () => {let t = Date();console.log(t)}
-
-datetime()
-date()
-d()
+A function that prints the current date and time. Hint: you can
+get the current date and time with new Date().
+<html><body><script>
+function datetime (){let t = Date();console.log(t)}
+date = function () {let t = Date();console.log(t)}
+d = () => {let t = Date();console.log(t)}
+
+datetime()
+date()
+d()
 </script></body></html>
\ No newline at end of file
diff --git a/5/functionnumberdic.html b/5/functionnumberdic.html
index 8ef2bd6..d593dbf 100644
--- a/5/functionnumberdic.html
+++ b/5/functionnumberdic.html
@@ -1,51 +1,51 @@
-A function that takes a number from 0 to 5 and returns the
-English word for that number. For example, 1 should return "one".
-Hint: use an array to define the mapping from numbers to
-strings.
-<html><body><script>
-function numdict (numb) {
-    dict = {
-        0 : "Zero",
-        1 : "One",
-        2 : "Two",
-        3 : "Three",
-        4 : "Four",
-        5 : "Five"
-    }
-    word = dict[numb]
-    console.log(word)
-    return word
-}
-
-let numberdictionary = function (numb) {
-    dict = {
-        0 : "Zero",
-        1 : "One",
-        2 : "Two",
-        3 : "Three",
-        4 : "Four",
-        5 : "Five"
-    }
-    word = dict[numb]
-    console.log(word)
-    return word
-}
-
-let nd = (numb) => {
-    dict = {
-        0 : "Zero",
-        1 : "One",
-        2 : "Two",
-        3 : "Three",
-        4 : "Four",
-        5 : "Five"
-    }
-    word = dict[numb]
-    console.log(word)
-    return word
-}
-
-numdict(1)
-numberdictionary(2)
-nd(3)
+A function that takes a number from 0 to 5 and returns the
+English word for that number. For example, 1 should return "one".
+Hint: use an array to define the mapping from numbers to
+strings.
+<html><body><script>
+function numdict (numb) {
+    dict = {
+        0 : "Zero",
+        1 : "One",
+        2 : "Two",
+        3 : "Three",
+        4 : "Four",
+        5 : "Five"
+    }
+    word = dict[numb]
+    console.log(word)
+    return word
+}
+
+let numberdictionary = function (numb) {
+    dict = {
+        0 : "Zero",
+        1 : "One",
+        2 : "Two",
+        3 : "Three",
+        4 : "Four",
+        5 : "Five"
+    }
+    word = dict[numb]
+    console.log(word)
+    return word
+}
+
+let nd = (numb) => {
+    dict = {
+        0 : "Zero",
+        1 : "One",
+        2 : "Two",
+        3 : "Three",
+        4 : "Four",
+        5 : "Five"
+    }
+    word = dict[numb]
+    console.log(word)
+    return word
+}
+
+numdict(1)
+numberdictionary(2)
+nd(3)
 </script></body></html>
\ No newline at end of file
diff --git a/5/wrapper.html b/5/wrapper.html
new file mode 100644
index 0000000..e8d455f
--- /dev/null
+++ b/5/wrapper.html
@@ -0,0 +1,12 @@
+<html><body><script>
+function makeWrapper (prefix, suffix) {
+    return function (string){
+        console.log(prefix + string + suffix)
+        return prefix + string + suffix
+    }
+}
+let itsawrap = makeWrapper("[","]")
+
+itsawrap("let me out")
+
+</script></body></html>
\ No newline at end of file
diff --git a/6/class.html b/6/class.html
new file mode 100644
index 0000000..70f35e9
--- /dev/null
+++ b/6/class.html
@@ -0,0 +1,37 @@
+<html><pre id="log"></pre><body><script>
+!function(){var n=document.getElementById("log");console.log=function(){for(var i=0;i<arguments.length;i++)"object"==typeof arguments[i]?n.innerHTML+=(JSON&&JSON.stringify?JSON.stringify(arguments[i],void 0,2):arguments[i])+"<br />":n.innerHTML+=arguments[i]+"<br />"}}();
+
+class Player {
+ constructor(startX, startY) {
+ this.x = startX;
+ this.y = startY;
+ }
+
+ move(dx, dy) {
+ this.x += dx;
+ this.y += dy;
+ }
+}
+let player1 = new Player(0,0);
+
+let player2 = new Player(0,0);
+
+console.log(player2.x)
+console.log(player2.y)
+console.log(player2.move(-3,10))
+console.log(player2.x)
+console.log(player2.y)
+console.log(player2.move(4,-7))
+console.log(player2.x)
+console.log(player2.y)
+
+console.log(player1.x)
+console.log(player1.y)
+console.log(player1.move(-20,4))
+console.log(player1.x)
+console.log(player1.y)
+console.log(player1.move(16,-9))
+console.log(player1.x)
+console.log(player1.y)
+
+</script></body></html>
\ No newline at end of file
diff --git a/6/pets.html b/6/pets.html
new file mode 100644
index 0000000..4b130e4
--- /dev/null
+++ b/6/pets.html
@@ -0,0 +1,35 @@
+<html><body><script>
+function Cat(name) {
+ this.name = name;
+}
+Cat.prototype.sayHello = function () {
+ console.log(`Miaow! My name is ${this.name}.`);
+};
+
+let kiki = new Cat("Kiki");
+kiki.sayHello();
+
+class Dog {
+ constructor(name) {
+ this.name = name;
+ }
+ sayHello() {
+ console.log(`Woof! My name is ${this.name}.`);
+ }
+}
+
+let felix = new Dog("Felix");
+
+let moona = new Cat("Moona");
+moona.sayHello = function () {
+ console.log(`HELLO!!! I'M ${this.name.toUpperCase()}!`);
+};
+moona.sayHello();
+
+let yappy = new Dog("Yappy");
+yappy.sayHello = function (){
+    console.log(`Bark Bark! I'M ${this.name.toUpperCase()}!`)
+}
+yappy.sayHello();
+felix.sayHello();
+</script></body></html>
\ No newline at end of file
diff --git a/6/subclass.html b/6/subclass.html
new file mode 100644
index 0000000..fec3bed
--- /dev/null
+++ b/6/subclass.html
@@ -0,0 +1,64 @@
+<html><pre id="log"></pre><body><script>
+!function(){var n=document.getElementById("log");console.log=function(){for(var i=0;i<arguments.length;i++)"object"==typeof arguments[i]?n.innerHTML+=(JSON&&JSON.stringify?JSON.stringify(arguments[i],void 0,2):arguments[i])+"<br />":n.innerHTML+=arguments[i]+"<br />"}}();
+
+class Actor {
+ constructor(startX, startY) {
+ this.x = startX;
+ this.y = startY;
+ }
+
+ move(dx, dy) {
+ this.x += dx;
+ this.y += dy;
+ }
+ distanceTo(otherActor) {
+ let dx = otherActor.x - this.x;
+ let dy = otherActor.y - this.y;
+ return Math.hypot(dx, dy);
+ }
+}
+
+class Player extends Actor {
+ constructor(startX, startY) {
+ super(startX, startY);
+this.hp = 100;
+ }
+ move(dx, dy) {
+ this.x += dx;
+ this.y += dy;
+}
+}
+
+class Enemy extends Actor {
+ attack(player) {
+ if (this.distanceTo(player) < 4) {
+ player.hp -= 10;
+ return true;
+ } else {
+ return false;
+ }
+ }
+}
+
+class Follower extends Actor{
+    constructor(startX,startY, player){
+    super(startX,startY)
+    this.player = player
+    }
+    follow(player){
+        this.x = player.x
+        this.y = player.y
+    }
+}
+
+let player = new Player(0,0);
+let follower = new Follower(0,0);
+let enemy = new Enemy(0,0);
+
+player.move(10,10)
+console.log(player.x, player.y)
+console.log(follower.x,follower.y)
+follower.follow(player)
+console.log(follower.x,follower.y)
+
+</script></body></html>
\ No newline at end of file
diff --git a/7/helloworld.html b/7/helloworld.html
new file mode 100644
index 0000000..3e1bc26
--- /dev/null
+++ b/7/helloworld.html
@@ -0,0 +1,10 @@
+ <!DOCTYPE html>
+ <html>
+ <head>
+ <title>Hello, World!</title>
+ </head>
+ <body>
+ <h1 id="main-heading">Hello! My name is slim shady.</h1>
+ <p id="pp">Welcome to my document.</p>
+ </body>
+</html>
\ No newline at end of file
diff --git a/7/index.html b/7/index.html
new file mode 100644
index 0000000..0724c34
--- /dev/null
+++ b/7/index.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>Hello, JavaScript!</title>
+ <script src="script.js"></script>
+ <link href="style.css" rel="stylesheet">
+ </head>
+ <body>
+    <h1 id="main-heading">Hello, <strong>JavaScript</strong>
+        !</h1>
+         <p class="highlight">This is my first <strong>paragraph
+        </strong>.</p>
+         <p>This is my second <strong>paragraph</strong>.</p>
+         <h1>Here's another heading.</h1>
+         <p class="highlight">This is my third <strong>paragraph
+        </strong>.</p>
+        <p class="em">This is my <em>fourth</em> paragraph.</p>
+        <p class="pre"> This is my <pre>fifth</pre> paragraph.</p>
+ </body>
+</html>
\ No newline at end of file
diff --git a/7/script.js b/7/script.js
new file mode 100644
index 0000000..cb1cd3a
--- /dev/null
+++ b/7/script.js
@@ -0,0 +1 @@
+console.log("Hello, HTML!")
\ No newline at end of file
diff --git a/7/style.css b/7/style.css
new file mode 100644
index 0000000..439acde
--- /dev/null
+++ b/7/style.css
@@ -0,0 +1,28 @@
+h1 {
+    color: green;
+    font-style:italic;
+    font-family: system-ui;
+}
+#main-heading {
+    font-size: 48px;
+}
+strong {
+color: yellowgreen;
+}
+p strong {
+font-size: 24px;
+}
+.highlight {
+background-color: burlywood;
+}
+.highlight strong {
+background-color: thistle;
+}
+
+em {
+background-color: aqua;
+}
+
+pre{
+color: blueviolet;
+}
\ No newline at end of file
