title: How to click-and-edit an element inline
body: <p>I am not sure what it is called, but I want to be able to click on e.g. a <code>div</code> containing a number, and then it will change into a input text field, with the value being the number I clicked.</p>
  
  <p>Then I want to edit the number, and click off (<code>onblur</code> event), and it will change back to a <code>div</code>, from the text field showing the new edited number. The number would have also been updated into the database via ajax.</p>
  
  <p>What is this function called?<br>
  What is the best way to code this?</p>