Edit TD on click

Make table cells editable on click.

On click – the cell should became “editable” (textarea appears inside), we can change HTML. There should be no resize, all geometry should remain the same.
Buttons OK and CANCEL appear below the cell to finish/cancel the editing.
Only one cell may be editable at a moment. While a <td> is in “edit mode”, clicks on other cells are ignored.
The table may have many cells. Use event delegation.

The demo:

On click – replace innerHTML of the cell by <textarea> with same sizes and no border. Can use JavaScript or CSS to set the right size.
Set textarea.value to td.innerHTML.
Focus on the textarea.
Show buttons OK/CANCEL under the cell, handle clicks on them.