如何用jQuery中动态生成的元素替换Div元素？

Question

I have a div structure like this

<div class="col-md-12" id="dvInsert">
    // insert dynamic generated elements 
</div>

I am decoding HTML elements and want to append to existing div but its showing div structure in browser like this:

     <div class="col-md-12">
         <p>Hello this is my new paragraph</p>
     </div>


function htmlDecode(value) {

         $("#dvInsert").append($('<div/>').html(value).text());
     }

I have also tried this but its also shwoing div strcuture rather then text.

 $($('<div/>').html(value).text()).appendTo("#dvInsert");

Value of value is <div class="row"><div>   <div class="col-md-12"></div><div>         <p>Hello this is my new paragraph</p></div><div>     </div></div><div></div></div> <div class="row"><div>   <div class="col-md-12"></div><div>         <p>Hello this is my new paragraph</p></div><div>     </div></div><div></div></div>

Answer 1

What goes inside .append as parameter should be an jquery object. In your case, you are already creating an object with this: $('<div/>').html(value) . You just need to discard .text() . In short, you need to change this

$('<div/>').html(value).text() 

to

$('<div/>').html(value)

Answer 2

My Friend Hope you have to just replace the existing div you can try something like this below

$("#div1").replaceWith("<div>I'm new!</div>");

For more details about replace with Read

Answer 3

you can try to run it twice:

var escaped1 = $('<div/>').html(value).text();
var escaped2 = $('<div/>').html(escaped1).text();

$("#dvInsert").append($(escaped2));

but I'm sure that there is a better way...