If you want to replace html element with some other element, the jquery replaceWith method can be used.
You can replace some specified DOM element with the other html or DOM element. The replaceWith() method is used in this case.
Syntax:
selector.replaceWith( content )
The content inside replaceWith method can be a html element or it can be a text.
Example:
<html>
<head>
<title>The jQuery Example</title>
<script type = "text/javascript" src = "http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type = "text/javascript" language = "javascript">
$(document).ready(function() {
$("#divone").click(function () {
$(this).replaceWith("<h1>some other data</h1>");
});
});
</script>
<style>
#divone{ margin:18px;padding:15px; border:2px solid #ccc; width:50px;}
</style>
</head>
<body>
<p>Click on the below:</p>
<span id = "answer"> </span>
<div id = "divone" style = "background-color:red;">
some data
</div>
</body>
</html>
0 Comment(s)