Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Selected Reading
How to get innerHTML of a div tag using jQuery?
To get the innerHTML of a div tag in jQuery, you should use the html() method instead of innerHTML property. The html() method is the jQuery equivalent of the native JavaScript innerHTML property and provides a cleaner, cross-browser compatible way to retrieve the HTML content of elements.
Example
You can try to run the following code to learn how to get innerHTML of a div tag using jQuery ?
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#button1").click(function(){
var one = $('.a').html();
alert(one);
});
});
</script>
</head>
<body>
<div class="a">Value one</div>
<button id="button1">Get</button>
</body>
</html>
The output of the above code is ?
When you click the "Get" button, an alert box will display: Value one
Key Points
Here are important points to remember when getting innerHTML using jQuery ?
- Use
.html()method instead of.innerHTMLproperty - The
.html()method returns the HTML content inside the first matched element - You can select elements using class selectors (
'.classname'), ID selectors ('#idname'), or any other jQuery selector - If multiple elements match the selector,
.html()returns content from the first element only
Conclusion
Using jQuery's html() method is the recommended way to get innerHTML of div elements, providing better browser compatibility and cleaner syntax than using the native innerHTML property directly.
Updated on: 2026-03-13T18:07:39+05:30
4K+ Views
Advertisements