How do you replace an HTML tag with another tag in jquery?

html, jquery, tags

Solution

Try this:

$('aside').contents().unwrap().wrap('<div/>');

- Get the contents of `aside` first.

- Now `unwrap` the contents.

- Now simply, `wrap` the contents inside a new tag, here a `div`.

DEMO

Also, you can do this using `.replaceWith()` method like:

$('aside').replaceWith(function () {
    return $('<div/>', {
        html: $(this).html()
    });
});

DEMO

Problem

I have a site I'm working on and it uses 'aside' tags, which I'm not getting IE8 to be able to read no matter what I try, even with an HTML5 Shiv. So, I'm wondering, how would you replace existing tags with other tags with jQuery? For example, if I wanted to change ``` <aside> <h3></h3> </aside> ``` to ``` <div> <h3></h3> </div> ``` How would that be done?

Original source

Related problems