'react typescript generate html from string - onclick

i have some problem creating board with onclick events im creating some string like:

 for(let i=0;i<8;i++){
        boardTable += '<tr><th></th>'
        for(let j=0;j<8;j++){
            const cellId = `${i}_${j}`
            boardTable+=`<td className="light" id="${cellId}" onClick="onCellClicked(${cellId})"></td>`
        }
    boardTable += '</tr>'
}

and in the end i use HtmlReactParser from

import HTMLReactParser from "html-react-parser";

and in the end i display using parser and function generateBoard (which mainly do the for loop)

   <div className="column">
        {HTMLReactParser(generateBoard(boardType.playerShipsBoard))}
        </div>

but have problem

enter image description here

and the onclick has not been added enter image description here

how should i do that ?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source