jQuery: replacing HTML with dynamic HTML instead of appending

Question

So far, I've got this code:

$("<div/>", {
    "id": "myId",
    "class": "myClass",
    "html": "Hello world!"
}).appendTo("#myContainer");

This appends

<div id="myId" class="myClass">Hello world!</div>

to #myContainer, as one would expect.

But instead of appending, I would like to have it replace the contents. I'm imagining something like this:

$("#myContainer").html("<div/>", {
    "id": "myId",
    "class": "myClass",
    "html": "Hello world!"
});

linkD · Accepted Answer · 2016-12-01 22:33:09Z

1

Actually, this is really easy to do, you just have to wrap the dynamic HTML in $() (or jquery(), if you prefer) again:

$("#myContainer").html($("<div/>", {
    "id": "myId",
    "class": "myClass",
    "html": "Hello world!"
}));

Even though this works perfectly fine, I'm wondering if there's a more elegant/performant way of doing this.

answered Dec 1, 2016 at 22:33

linkD

14114 bronze badges

Sign up to request clarification or add additional context in comments.

1 Answer 1