initial submit

css/style.css

@@ -139,3 +139,9 @@ h1 {font-weight: bold; margin-left: 10px;}
 #menu button {
     width: 120px;
 }
+
+#menu buttonReset {
+    width: 120px;
+    color: FFFFFF;
+    background: red;
+}

index.html

@@ -16,20 +16,21 @@
         <div class="zip-link"><img src="./images/logos/zip_logo.jpg" alt="Zipcode Wilmington"/></div>
     </header>
 
-    <h1>Loops Exercises</h1>
+    <h1>Loops Exercises - Andres</h1>
 
     <section id="menu">
       <ul>
-        <li><button type="button" class="btn btn-primary" onclick="yourFunctionName()">Example 2.1</button></li>
-        <li><button type="button" class="btn btn-primary" onclick="yourFunctionName()">Example 2.2</button></li>
-        <li><button type="button" class="btn btn-primary" onclick="yourFunctionName()">Example 2.3</button></li>
-        <li><button type="button" class="btn btn-primary" onclick="yourFunctionName()">Example 2.4</button></li>
-        <li><button type="button" class="btn btn-primary" onclick="yourFunctionName()">Example 2.5</button></li>
-        <li><button type="button" class="btn btn-primary" onclick="yourFunctionName()">Example 2.6</button></li>
-        <li><button type="button" class="btn btn-primary" onclick="yourFunctionName()">Example 2.7</button></li>
-        <li><button type="button" class="btn btn-primary" onclick="yourFunctionName()">Example 2.8</button></li>
-        <li><button type="button" class="btn btn-primary" onclick="yourFunctionName()">Example 2.9</button></li>
-        <li><button type="button" class="btn btn-primary" onclick="yourFunctionName()">Example 2.10</button></li>
+        <li><button type="button" class="btn btn-primary" onclick="oneToTen()">Example 2.1</button></li>
+        <li><button type="button" class="btn btn-primary" onclick="oddNumbers()">Example 2.2</button></li>
+        <li><button type="button" class="btn btn-primary" onclick="squares()">Example 2.3</button></li>
+        <li><button type="button" class="btn btn-primary" onclick="random4()">Example 2.4</button></li>
+        <li><button type="button" class="btn btn-primary" onclick="even(20)">Example 2.5</button></li>
+        <li><button type="button" class="btn btn-primary" onclick="powers(8)">Example 2.6</button></li>
+        <li><button type="button" class="btn btn-primary" onclick="annoying()">Example 2.7</button></li>
+        <li><button type="button" class="btn btn-primary" onclick="triangle()">Example 2.8</button></li>
+        <li><button type="button" class="btn btn-primary" onclick="tableSquare()">Example 2.9</button></li>
+        <li><button type="button" class="btn btn-primary" onclick="tableSquares(6)">Example 2.10</button></li>
+        <li><buttonReset type="button" class="btn btn-primary" onclick="reset()">RESET</buttonReset></li>
       </ul>
     </section>
 

js/script.js

@@ -2,6 +2,95 @@
 
 var display = document.getElementById("display");
 
-function yourFunctionName (){
-  display.innerHTML = "hello";
+function oneToTen () {
+    for (var i = 1; i < 11; i++) {
+        display.innerHTML += i + '<br>';
+    }
+}
+
+function oddNumbers () {
+    for (var i = 1; i < 20; i++) {
+        if (i % 2 !== 0) {
+          display.innerHTML += i + '<br>';
+        }
+    }
+}
+
+function squares () {
+    var squaredNumber = 1, counter = 1;
+    while (squaredNumber < 101) {
+        display.innerHTML += squaredNumber + '<br>';
+        counter ++;
+        squaredNumber = counter * counter;
+    }
+}
+
+function random4 () {
+    var random, randomInt;
+    for (var i = 1; i < 5; i++) {
+        random = Math.random() * 100;
+        randomInt = Math.round(random);
+        display.innerHTML += randomInt + '<br>';
+    }
+}
+
+function even (n) {
+    for (var i = 1; i < n; i++) {
+        if (i % 2 === 0) {
+            display.innerHTML += i + '<br>';
+        }
+    }
+}
+
+function powers (n) {
+    for (var i = 1; i <= n; i++) {
+        display.innerHTML += Math.pow(2,i) + '<br>';
+    }
+}
+
+function annoying () {
+  var answer;
+  do {
+        answer = prompt("Arewethereyet?");
+        display.innerHTML += answer + '<br>';
+  }
+  while (answer !== "Yes")
+    display.innerHTML += "Good";
+}
+
+//String.prototype.Repeat could solve this without the use of a nested loop
+function triangle () {
+  var line = "";
+  for (var i = 1; i < 6; i++) {
+    for (var j = i; j < 6; j++) {
+      line += "*";
+      break;
+    }
+    display.innerHTML += line + '<br>';
+  }
+}
+
+function tableSquare () {
+  for (var i = 1; i < 5; i++) {
+    for (var j = i; j < 5; j++) {
+      display.innerHTML += (j + "|") + (j * 2 + "|") + (j * 3 + "|") + (j * 4 + "|") + '<br>';
+      break;
+    }
+  }
+}
+
+function tableSquares (n) {
+  var currentResult;
+  for (var i = 1; i <= n; i++) {
+      var string = "";
+     for (var j = 1; j <= n; j++) {
+       currentResult = i * j;
+       string += currentResult + " | ";
+     }
+        display.innerHTML += string + '<br>';
+  }
+}
+
+function reset () {
+  display.innerHTML = "";
 }