How to Replace innerHTML of a Div using jQuery
Topic:
JavaScript / jQuery
Prev
|
Next
Answer: Use the jQuery
html()
Method
You can simply use the jQuery
html()
method to replace innerHTML of a div or any other element.
The jQuery code in the following example will replace the innerHTML of a DIV element having id
pageTitle
with an HTML heading on click of the button. Let's try it out:
<!DOCTYPE html>
<html lang="en">
<title>jQuery Replace innerHTML of a Div</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("#pageTitle").html("<h1>Hello, World!</h1>");
</script>
</head>
<div id="pageTitle">
<p><b>Click the following button to replace me.</b><p>
<button type="button">Replace HTML</button>
</body>
</html>
Here are some more FAQ related to this topic:
How to toggle text inside an element on click using jQuery
How to check if an element exists in jQuery
How to get the text inside an element using jQuery
Previous Page
Next Page
Is this website helpful to you? Please give us a
like
,
or share your
feedback
to help us improve
.
Connect with us on
Facebook
and
Twitter
for the latest updates.
