javascript - Adding DOM elements using contentEditable -

I created an editable diva, and I want to change smiley signs with smiley images.

But whenever I place a string with a dome element (

What's going on? (I am doing it in Safari)

This is my code:

  var txtInput = document.getElementById ("asdf"); TxtInput.contentEditable = true; TxtInput.addEventListener ("textInput", function (event) {var str = txtInput.inner HTML; txtInput.innerHTML = str.replace ("f", "& lt; span> w  

I think you should enter inserthtml or Insert , although I can not work myself at any one of them.