Rainbow Text Exercise

leekoby · Jan 5, 2023 · 2a2e77b · 2a2e77b
1 parent e4cb039
commit 2a2e77b
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 0 deletions.
diff --git a/56_Rainbow Text Exercise/app.js b/56_Rainbow Text Exercise/app.js
@@ -0,0 +1,9 @@
+const colors = ['red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'violet']; //PLEASE DON'T CHANGE THIS LINE!
+
+//YOU CODE GOES HERE:
+const singleLetters = document.querySelectorAll('span');
+let color = 0;
+for (let singleLetter of singleLetters) {
+    singleLetter.style.color = colors[color];
+    color++;
+}
diff --git a/56_Rainbow Text Exercise/index.html b/56_Rainbow Text Exercise/index.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+
+<head>
+    <title>Rainbow</title>
+    <!--LEAVE THESE LINES ALONE, PLEASE! THEY MAKE THE LIVE PREVIEW WORK!-->
+    <script src="node_modules/babel-polyfill/dist/polyfill.js" type="text/javascript"> </script>
+    <script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
+
+</head>
+
+<body>
+    <!--DON'T TOUCH THIS FILE PLEASE!-->
+    <h1>
+        <span>R</span>
+        <span>A</span>
+        <span>I</span>
+        <span>N</span>
+        <span>B</span>
+        <span>O</span>
+        <span>W</span>
+    </h1>
+</body>
+
+</html>