Dynamically change a HTML elements type [duplicate]

Question

I am wondering if its possible to change a HTML elements data type with javascript?

For example change an img to a div? The reason I am doing this & not destroying the img & creating a div is because the element contains A LOT of inline styling so I would need to copy all the inline style from the img to the div. PS: this website is only for iPad, so cross-browser compatibility is not an issue.

var div  = img.cloneNode(true);
div.type = "div";

So it would be easier to clone the node/element using img.cloneNode(true), then must change the type to a div. I hope this is possible?

If not maybe there is a easy way to copy one elements style to another elements? Maybe...

// img is an img HTML element
var div = document.createElement("div");
div.style = img.style;
document.body.removeChild(img); // does that destroy div.style aswell?

Answer 1

You cannot change the type of an element. Yes, the div's style will be overwritten unless you concatenate div.style+=img.style. In this case like img style attributes override the div's.