In this example, we are going to click on the button and replace the containing div with its child divs and append the class name of the selected element to the paragraph.
<!DOCTYPE html>
<html>
<head>
<style>
.container {
background-color: rgb(5, 255, 155);
}
.inner {
color: rgb(33, 17, 153);
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
</head>
<body>
<p>
<button>Remove Appwrk Color!</button>
</p>
<div class="container">
<div class="inner">Welcome to Appwrk IT Solution</div>
<div class="inner">Welcome to Appwrk IT Solution</div>
<div class="inner">Welcome to Appwrk IT Solution</div>
</div>
<script>
$( "button" ).on( "click", function() {
var $container = $( "div.container" ).replaceWith(function() {
return $( this ).contents();
});
$( "p" ).append( $container.attr( "class" ) );
});
</script>
</body>
</html>
