how to fetch all HTML Table Records and modify all records accordingly using jquery and Javascript

In my example, I have fetch HTML Table Records and Convert to Class List Object for C#

Result: Click Here

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>

<script>

  $( document ).ready(function() {

    // Get the table element

    const table = document.getElementsByTagName("table")[0];

    // Get all the table rows

    const rows = table.rows;

    // Create an empty array to store the table data

    const data = [];

    // Loop through each row and get the cell data

    for (let i = 0; i < rows.length; i++) {

      const cells = rows[i].cells;

      const rowData = {};

      //new Columns { CharacterName = "", Char = "", Code = "", Decimal = "", Binary = "", Hex = "" },

      var stringCon = "new Columns {";

      // Create an object for each row

      for (let j = 0; j < cells.length; j++) {

        //console.log("=====> :"+ cells.length + ":::::" + j);

        const header = (table.rows[0].cells[j].textContent).replace(" ","");

        const cellData = cells[j].textContent;

         if(j == 5)

            stringCon += ''+ header + ' = "' + cellData.replace(" ","") + '"';

        else  

            stringCon += ''+ header + ' = "' + cellData + '"';

       

        if(j < 5)

        {

          stringCon += ", ";

        }

        // const cellData = cells[j].textContent;

        // //console.log("cellData: ", cellData);

        //

        // //console.log("header: ", header);

        // rowData[header] = cellData;

      }

      stringCon += "},";

      console.log(stringCon);

      // Add the object to the array

      //data.push(rowData);

    }

    // // Print the array in the console

    // console.log("Hello: "+ data);

    // for (let i = 0; i < rows.length; i++) {

    // }

});

</script>