JSFiddle - React, Tailwind, and code Playground

HTML

<table border=1><tr index=0><td onclick='edit(this)' satir=0 sutun='0'>Johnson </td><td onclick='edit(this)' satir=0 sutun='1'>London</td></tr></table>

JavaScript

var isEdit=0;
  var data="";
  var save=null;
  var cancel=null;
  var myInput=null;
  var firstValue="";

function edit(td){

    
     if(isEdit==0)  { 

        isEdit=1;

    
     firstValue=td.innerHTML;
    
     myInput=document.createElement("input");
    td.appendChild(myInput);
    myInput.focus();
    
     save=document.createElement("input");
    save.type="button";
     cancel=document.createElement("input");
    cancel.type="button";
    
    save.value="Save";
   
    
    cancel.value="Cancel";
    
    td.appendChild(save);
      td.appendChild(cancel);
      
 

}



cancel.addEventListener("click",function(){

            td.innerHTML=firstValue;


            isEdit=0;
            return  false;

             
        
    });
     save.addEventListener("click",function(){
       
        td.value=myInput.value;
        isEdit=0;

     });


}