How to switch states?

Question

css

Guys, a question.
I have some text, when you click on it, the input should drop out to change the text, and when we changed the text and click outside the inputa, everything should go back (that is, the input will change to text). So I don't know how to make this return.
https://jsfiddle.net/tvcdafLc/2/

Answer 1

Maybe it's better to use inline editing?
Like here : double-click - editing, double-click again - turn off editing.