Learning jQuery

jQuery and HTML. Yes, in today post, I will show you some of the jQuery methods that you can use to change the HTML of the DOM elements. These methods are useful and easy to understand.

To change HTML Content

The html() method changes the contents (innerHTML) of matching HTML elements.

$("div").html("jQuery By Example Rocks!!!");

To get HTML Content

The html() method can also be used to get the contents (innerHTML) of matching HTML elements.

var dvHTML = $("div").html();

Adding HTML content

To add HTML content, there are two methods append() and prepend(). The append() method appends content to the inside of matching HTML elements.

$("div").append(" jQuery blog with great content.");

The prepend() method "prepends" content to the inside of matching HTML elements.

$("div").prepend(" jQuery blog with great content.");

You can also use after() and before() method to add HTML. The after() method inserts HTML content after all matching elements.

$("div").after("<div><br/> jQuery blog with great content.</div>");?

So, now the HTML of the page would be,

<div> jQuery By Example..
</div>
<div>
    <br/> jQuery blog with great content.
</div>?

The before() method inserts HTML content before all matching elements.

$("div").before("<p><br/> Name of blog is<br/></p>");

So, now the HTML of the page would be,

<p><br/> Name of blog is<br/>
</p>
<div> jQuery By Example..
</div>

Feel free to contact me for any help related to jQuery, I will gladly help you.