From a5220ea0f19507e60b2727af6ef6174bc7a68ab3 Mon Sep 17 00:00:00 2001
From: Mrazo04 <munguiamickey@gmail.com>
Date: Wed, 8 Feb 2023 19:08:18 -0600
Subject: [PATCH 1/2] handleClick

---
 index.html | 16 +++++++++++++---
 scripts.js | 10 +---------
 2 files changed, 14 insertions(+), 12 deletions(-)

diff --git a/index.html b/index.html
index 19d0dee..26b5e05 100644
--- a/index.html
+++ b/index.html
@@ -19,9 +19,19 @@ <h1>Welcome to Tic Tac Toe</h1>
       <table>
         <tr>
           <!-- the onclick calls a function called "handleClick" and passes itself to it -->
-          <td id='top-left' onclick="handleClick(this)" ></td>
-          <td id='top-middle'></td>
-          <td></td>
+          <td id='top-left' onclick="handleClick(this)"></td>
+          <td id='top-middle' onclick="handleClick(this)"></td>
+          <td id='top-right' onclick="handleClick(this)"></td>
+        </tr>
+        <tr>
+          <td id='mid-left' onclick="handleClick(this)"></td>
+          <td id='mid-middle' onclick="handleClick(this)"></td>
+          <td id='mid-right' onclick="handleClick(this)"></td>
+        </tr>
+        <tr>
+          <td id='bottom-left' onclick="handleClick(this)"></td>
+          <td id='bottom-middle' onclick="handleClick(this)"></td>
+          <td id='bottom-right' onclick="handleClick(this)"></td>
         </tr>
         <!-- @TODO create new rows and cells for the rest of your TTT board. -->
         <!-- @TODO give each new cell an id & an event listener to call the "handleClick" function -->
diff --git a/scripts.js b/scripts.js
index ba09e74..90f53bf 100644
--- a/scripts.js
+++ b/scripts.js
@@ -27,15 +27,6 @@ const handleClick = (element) => {
 }
 
 
-
-
-
-
-
-
-
-
-
 // this function places the "currentMarker" inside the HTML element that was clicked and calls the "changeMarker" function.
 const addMarker = (id) => {
 
@@ -50,6 +41,7 @@ const addMarker = (id) => {
   // .getElementById(id)
   // document
   // .innerHTML 
+document.getElementById(id).innerHTML = currentMarker
 
   changeMarker()
 }

From 611852f684e4817d6f70a12cfdae28be70e5d903 Mon Sep 17 00:00:00 2001
From: Mrazo04 <munguiamickey@gmail.com>
Date: Fri, 10 Feb 2023 12:58:16 -0600
Subject: [PATCH 2/2] added code for resetting squares

---
 scripts.js | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/scripts.js b/scripts.js
index 90f53bf..41d53fe 100644
--- a/scripts.js
+++ b/scripts.js
@@ -10,8 +10,6 @@
 let currentMarker = 'X'
 
 
-
-
 // this "handleClick" function is called when a box is clicked. Here, "element" will hold the same value as "this" does in the HTML. 
 // "this" is a special word in JS but "element" could have been "thing" or "el" or whatever we wanted it to be as long as we use it again in the "console.log" statement
 const handleClick = (element) => {
@@ -43,7 +41,7 @@ const addMarker = (id) => {
   // .innerHTML 
 document.getElementById(id).innerHTML = currentMarker
 
-  changeMarker()
+changeMarker()
 }
 
 
@@ -75,10 +73,11 @@ const changeMarker = () => {
 
 // This "resetBoard" function is called when the user clicks on the "Restart" button.
 const resetBoard = () => {
-  
+
+
   // @TODO-3: To make your "Restart" button work you'll need to build a line of code here that:
       // collects all of the "td" elements into an HTML Collection: https://www.w3schools.com/jsref/dom_obj_htmlcollection.asp  
-    
+    const squares = document.getElementsByTagName('td')
   // @TODO-3.5: MIX & MATCH, You will need the following pieces of code to build that line:
   // squares
   // .getElementsByTagName("TD")