Skip to content
Advertisement

How to append html tags from an div onto another div?

Is it possible to append html tags from a content-editable div to another div? I wanted to make an html editor, and I wanted to make automatic preview.

Here is the jsfiddle code: https://jsfiddle.net/eqw8L4to/12/

And here is the js code where I tried getting html tags from .html, and tried appending it to .result:

$(document).ready(function() {
    $(".html").keydown(function(event) {
        var x = event.keyCode
        if (x == 27 && event.ctrlKey) {
            $(".result").html("")
            var y = $(".html").html()
            $(".result").append(y)
        }
    })
})

Advertisement

Answer

https://jsfiddle.net/cse_tushar/68na2mrq/8/

Get the text from contenteditable div and replace place in the result HTML

$(document).ready(function() {
  const el = $("div.html");
  const result = $(".result");
  el.keydown(function(event) {
    if (event.keyCode === 27 && event.ctrlKey) {
      result.html(el.text());
    }
  })
})

enter image description here

Advertisement