Zaxap,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<script>
window.addEventListener('DOMContentLoaded', function() {
[].forEach.call( document.querySelectorAll('body *'), function(el) {
[].reduceRight.call(el.attributes,function(elem, attr) {
var wrapper = document.createElement("div"),
parent = elem.parentNode;
parent.replaceChild(wrapper,elem);
wrapper.setAttribute(attr.name, attr.value);
el.removeAttribute(attr.name);
wrapper.appendChild(elem);
return wrapper
},el)
});
});
</script>
</head>
<body>
<div id="p1-id" class="p1-class" data-attribute="data-value">
my
<p сlass="p2-class1 p2-class2">
super <i class="italic"><b>paragraph</b></i>
</p>
</div>
</body>
</html>
