How to make tags editable in HTML?

December 27, 2020 - 1 min read

To make any tags editable in HTML, you can use the global contenteditable attribute and pass the string true.

For an example let's consider a div tag, with some content inside it like this,

<!-- Not editable right now -->
<div>This is not editable right now!</div>

Normally the content inside a div tag is not editable.

Now let's make it editable by using the contenteditable attribute and passing string true like this,

<!-- 🔥 Make div tag editable 🔥 -->
<div contenteditable="true">
  This is editable right now! Click me and write something
</div>
<!-- Go to link below to play with it -->

See this example live in JSBin

Feel free to share if you found this useful 😃.