<!DOCTYPE HTML>
<
html
>
<
head
>
<
title
>
JQuery | Change an element type.
</
title
>
<
script
src
=
</
script
>
</
head
>
<
body
id
=
"body"
style
=
"text-align:center;"
>
<
h1
style
=
"color:green;"
>
GeeksforGeeks
</
h1
>
<
p
id
=
"GFG_UP"
style
=
"font-size: 15px; font-weight: bold;"
>
</
p
>
<
button
onclick
=
"GFG_Fun()"
>
click here
</
button
>
<
br
><
br
>
<
b
style
=
"color:green; font-weight: bold;"
>
Welcome to GeeksforGeeks
</
b
>
<
script
>
var up = document.getElementById('GFG_UP');
up.innerHTML = "Click on the button to "
+ "replace an HTML element";
function GFG_Fun() {
var oldElement = $("b");
var newElement = $("<
h1
>");
for(var i=0; i<
oldElement
[0].attributes.length; i++) {
var
Attr
=
oldElement
[0].attributes[i].nodeName;
var
AttrVal
=
oldElement
[0].attributes[i].nodeValue;
newElement.attr(Attr, AttrVal);
}
newElement.html(oldElement.html());
oldElement.replaceWith(newElement);
}
</script>
</
body
>
</
html
>