JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <thead>
        <tr>
            <td>ONE</td>
            <td>TWO</td>
        </tr>
    </thead>
    <tbody id="table_tbody">
        
    </tbody>
</table

CSS

#table_tbody{
    background:#eee;
}

JavaScript

$(document).ready(function() {
    
    var playerFunc = function() { // Function scope!
	    alert("hren");
    }
    
    
    var element = $("<tr>")
              .append( $("<td />", {"text":"bla1"}) )
              .append( $("<td />", {"text":"bla2"}) );
    
    for (var i=0; i<10; i++) {
       var elem = element.clone();
       elem.children().next().first().attr("id", "table_td"+ i );
	   $('#table_tbody').append(elem);
    }
    $("#table_tbody").on('click', 'td:odd', playerFunc );
                        
});