repeated code fixed

HW7/main.js

@@ -1,21 +1,22 @@
 let $table = document.createElement('table');
 
+function rerenderColor(e, color) {
+    Array.from($table.children).map(item => {
+        Array.from(item.children).filter(item => item.cellIndex === e.target.cellIndex).map(item => item.style.backgroundColor = color)
+    })
+}
+
 for(let i = 1; i < 10; i++) {
     let $tr = document.createElement('tr')
     for(let j = 1; j < 10; j++) {
         let $td = document.createElement('td')
         $td.innerText = String(j * i)
-        $td.onmouseover = (e) => {
-           Array.from($table.children).map(item => {
-            Array.from(item.children).filter(item => item.cellIndex === e.target.cellIndex).map(item => item.style.backgroundColor = 'red')
-        })
+
+        $td.addEventListener('mouseover', (e) => {
+            rerenderColor(e, 'red')
             $td.style.backgroundColor = 'green'
-        }
-        $td.onmouseout = (e) => {
-            Array.from($table.children).map(item => {
-                Array.from(item.children).filter(item => item.cellIndex === e.target.cellIndex).map(item => item.style.backgroundColor = 'white')
-            })
-        }
+        })
+        $td.addEventListener('mouseout', (e) => rerenderColor(e, 'transparent'))
         $tr.appendChild($td)
     }
     $table.appendChild($tr)