How to replace innerHTML of a div | jQuery
The innerHTML property is used to write the dynamic HTML content on an HTML document. When you need to replace the innerHTML dynamic content you can use the jQuery html() function and provide the new content.
$(selector).html(content)
Example
$('#msg').html('Div content changed...');
The jQuery html() method sets or returns the innerHTML content of the selected elements. When this method is used to set content, it overwrites the content of ALL matched elements.

Hello World!!
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#btnClick").click(function(){
$('#msg').html('Div content changed...');
});
});
</script>
</head>
<body>
<div id="msg">Hello World!!</div>
<button id="btnClick">Click me</button>
</body>
</html>

jQuery text()
You can use jQuery text() function to achieve the same. However, the text() function will change the (text) value of the specified element, but keep the html structure.
$(selector).text()
Example
$('#msg').text('Div content changed...');
Difference between text() and html() method in jQuery
The jQuery.html() treats the string as HTML, jQuery.text() treats the content as text. The .html() method is not available in XML documents. Unlike the .html() method, jQuery .text() can be used in both XML and HTML documents. Also, .html() method is 2x faster than .text()Change innerHTML content using JavaScript
You can use pure JavaScript to replace innerHTML of a div.
msg.innerHTML = 'Div content changed...'
Get innerHTML content using html()
When jQuery .html() method is used to return content, it returns the content of the FIRST matched element.
var cont = $('#msg').html();
Related Topics
- How to get input textbox value using jQuery
- Get Selected Dropdown Value on Change Event | jQuery
- How to submit a form using ajax in jQuery
- How can I get the ID of an element using jQuery
- Open Bootstrap modal window on Button Click Using jQuery
- How to select an element with its name attribute | jQuery
- How to get the data-id attribute using jQuery
- How to disable/enable submit button after clicked | jQuery
- Change the selected value of a drop-down list using jQuery
- How to get the value of a CheckBox with jQuery
- How to wait 'X' seconds with jQuery?
- How to detect enter key press on keyboard | jQuery
- How to allow numbers only in a Text Box using jQuery.
- How to dynamically create a div in jQuery?