JSFiddle - React, Tailwind, and code Playground

HTML

<table id="mytable">
    <tbody>
        <tr>
            <td data-name="Name">Editable (click me) </td>
             <td> - No editable</td>
        </tr>    
    </tbody>    
</table>


<div id="result"></div>

JavaScript

var n = 0;
$(document).ready(function() {
    $('#mytable').on("click", "td[data-name]", function(){
        $this = $(this);
        n++;
        $("#result").text("clicks: " + n);
        
        var oTxtBox = $("<input type='text' value='" + $this.text() + "' \>");
        $this.html(oTxtBox );
        
        oTxtBox.off("click");
        $this.off("click");
        //$this.unbind("click");
    });
});