Vista previa en vivo de HTML / CSS desde una etiqueta div y no desde una etiqueta de área de texto

quierocrear una vista previa en vivo de HTML / CSS en una página

Pero el código no se dará usando áreas de texto. El código se va a arreglar en la página (div)

Quiero que el usuario pueda alterar el código y eso se reflejará en el cuadro de vista previa en vivo. He creado la página donde puede cambiar partes del texto del script (para aficionados). Puedes previsualizar eso aquí:http://apolosiskos.co.uk/HTML-CSS-EDITOR/index3.html

01) La vista previa en vivo no funciona si reemplazo eltextarea con undiv.

02) Incluso si uso las áreas de texto, la vista previa en vivo no funciona porque en mi script HTML estoy usando elcodey elxmp Etiquetas

-> Fragmento que funciona con un área de texto pero no con un div:

var wpcomment = document.getElementById('WPComment');

wpcomment.blur = wpcomment.onkeypress = function(){
    document.getElementById('prevCom').innerHTML = this.value;
}
#prevCom
{
  background:#124;
  color:#fff;
  min-width:20px;
  min-height:50px;
  font-size:25pt;
}
<textarea name="WPcomment" id="WPComment" placeholder="Add comments:">aaaaa</textarea>

<div id="prevCom"></div>

Respuestas a la pregunta(3)

Su respuesta a la pregunta