get HTML content by using jQuery

By using normal javascript getting HTML content of any element is very difficult.

But, by using jQuery you can get HTML content of any element with simple function.

Below is the code to display HTML content

 

<html>
    <head>
        <title>This is jquery example to display HTML content</title>
        <script type="text/javascript" src="jquery.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
            //this is to display HTML content of parentid childs
            alert($('#parentid').html());
            //this is to display HTML content of parentid imeediate parent
            alert($('#parentid').parent().html());
            });   
        </script>
    </head>
    <body>
        <div id="parentid">
        <div id="childid">
        <div>First Element</div>
        <div>Second Element</div>
        <div>Third Element</div>
        <div>Fourth Element</div>
        </div>
        <p id="pid">This is from 'p' tag</p>
        </div>
    </body>
</html>

 

Here we are using the simple html() jQuery function to display HTML content.

$('#parentid').html() is used to get the HTML content of element "parentid".

$('#parentid').parent().html() is used to get the HTML content of parent element of element "parentid".

 

Download source code: HTML content.zip (35.68 kb)