Как я могу создать таблицу с помощью java script

---

с помощью java-скрипта я должен создать таблицу. сначала мне нужно дать 2 поля, там я дал строки и значения столбцов, затем будет 2 кнопки создать таблицу и очистить таблицу, когда значения даны и нажмите кнопку crate table затем таблица была создана, после этого я выбираю i столбец, который столбец изменится в красном цвете, как я могу кодировать для этой программы

Что я уже пробовал:

я пытался, но не получил решения, я получаю сообщение об ошибке

[Edit 0x01AA] скопировано из "ответа OP"

DOCTYPE html>

    
        <title> Set Background Color To Selected Table TR </title>
        <meta charset="windows-1252">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        
        <style>
            
             tr{cursor: pointer; transition: all .25s ease-in-out}
            .selected{background-color: red; font-weight: bold; color: #fff;}
            
        </style>
        
    
    
        
   
            
        
       <input type="text" name="rows" id="rows">
		<input type="text" name="columns" id="columns">
		<table id="myTable" border="1"></table> 
        <table id="myTable" border="2"></table>
        <form> 
		<input type="button" onclick="createTable()" value="Create the table">
		<input type="button" onclick="clearTable()" value="Clear the table">
		</form>     
        
        
     
                    <script>
            function createTable()
{
var data=[];
var ra= document.getElementById("rows").value;
var ca= document.getElementById("columns").value;
rn = ra;
cn = ca;
data.push(rn);
  
 for(var r=0;r<parseInt(rn,10);r++)
  {
   var x=document.getElementById('myTable').insertRow(r);
   for(var c=0;c<parseInt(cn,10);c++)  
    {
     var y=  x.insertCell(c);
     y.innerHTML="Row-"+r+" Column-"+c; 
    }
   }
   }
function clearTable()
{  
 for(var r=0;r<parseInt(rn,10);r++)
  {
   var x=document.getElementById('myTable').deleteRow(r);
   for(var c=0;c<parseInt(cn,10);c++)  
    {
     var y=  x.delete(c);
     y.innerHTML="Row-"+r+" Column-"+c; 
    }
   }
   }
function selectedRow()
{
                
                var index,table = document.getElementById("myTable");
            
                for(var i = 1; i < table.rows.length; i++)
                {
                    table.rows[i].onclick = function()
                    {
                        if(typeof index !== "undefined")
                        {
                           table.rows[index].classList.toggle("selected");
                        }
                        console.log(typeof index); 
                        index = this.rowIndex;
                        this.classList.toggle("selected");
                        console.log(typeof index);
                     };
                }
                
            }
            selectedRow();
                    </script>

---