JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<table>
<tr><td>5</td><td>5</td></tr>
<tr><td>2</td><td></td></tr>
<tr><td></td><td>5</td></tr>
</table>

CSS

table {
		font-size: 14px;
		border: 1px solid #8ab6d1; 
		font-family: Arial, Helvetica, sans-serif;
	} 
  
	table td {
		padding: 2px;
		margin: 1px;
		border: 1px solid #8ab6d1;
	}

JavaScript

$(function () {
    $("td").dblclick(function () {
        var OriginalContent = $(this).text();
         
        $(this).addClass("cellEditing");
        $(this).html("<input type='text' value='" + OriginalContent + "' />");
        $(this).children().first().focus();
 
        $(this).children().first().keypress(function (e) {
            if (e.which == 13) {
                var newContent = $(this).val();
                $(this).parent().text(newContent);
                $(this).parent().removeClass("cellEditing");
            }
        });
         
    $(this).children().first().blur(function(){
        $(this).parent().text(OriginalContent);
        $(this).parent().removeClass("cellEditing");
    });
    });
});