From 2cdd79ecc40093ac15b984644dcfd28bc0ad8f17 Mon Sep 17 00:00:00 2001
From: chloeeffron <chloe.effron@gmail.com>
Date: Tue, 14 Jun 2016 00:04:42 -0400
Subject: [PATCH] Made traffic light work using jQuery

used jQuery to make each button illuminate the proper bulb.
---
 index.html |  4 +++-
 js/app.js  | 30 ++++++++++++++++++++++++++++++
 2 files changed, 33 insertions(+), 1 deletion(-)
 create mode 100644 js/app.js

diff --git a/index.html b/index.html
index 0180c07..02fa2d9 100644
--- a/index.html
+++ b/index.html
@@ -23,5 +23,7 @@ <h1 id="goButton" class="button">Go</h1>
       <div id="goLight" class="bulb"></div>
     </div>
 
-  </body>
+    <script src="js/jquery-2.1.4.js"></script>
+    <script src="js/app.js"></script>
+</body>
 </html>
diff --git a/js/app.js b/js/app.js
new file mode 100644
index 0000000..bea3afa
--- /dev/null
+++ b/js/app.js
@@ -0,0 +1,30 @@
+$(function(){
+  $("#stopButton").click(illuminateRed);
+  $("#slowButton").click(illuminateYellow);
+  $("#goButton").click(illuminateGreen);
+
+ function illuminateRed() {
+   console.log ("this is working");
+   // clear whatever light is already illuminated
+   clearLights();
+   // illuminate red light
+   $("#stopLight").css("background-color", "red");
+ }
+
+ function illuminateYellow() {
+   clearLights();
+   $("#slowLight").css("background-color", "yellow");
+ }
+
+function illuminateGreen() {
+  clearLights();
+  $("#goLight").css("background-color", "green");
+}
+
+function clearLights(){
+  $("#stopLight").css("backgroundColor", "black");
+  $("#slowLight").css("backgroundColor", "black");
+  $("#goLight").css("backgroundColor", "black");
+}
+
+});
\ No newline at end of file