18
Jul
2012

Insert text to an element using jQuery

Posted in: jQuery , No Comments

jquery_logo
This is a basic and easy jQuery tutorial. Using jQuery you can insert some text inside a target element.

step 1:
Prepare basic HTML text.

<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>

At this stage, our page looks like this.

step 2:
Add an empty region of class newtext in which we will insert some text.

<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
<div class="newtext"></div>

step 3:
Call jQuery Library.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

step 4:
Now we will add jQuery code in head section and tell it to find class newtext and insert some text.

<script type="text/javascript">
$(document).ready(function() {
	$(".newtext").text("This is new text inserted using jQuery");
});
</script>

Done!!!
Check the page after adding jQuery.



This will also replace any text already present in that element

About the Author

Name: Ravi Shekhar
I love learning and sharing web stuffs.

Share this post

Twitter Facebook Google Buzz Digg StumbleUpon Delicious Technorati

Leave a Reply