Jquery sets the value of text example of of sets the text box DIV form value

Jquery Settings -text (), HTML (), and val()

We'll use the same three methods from the previous chapter to set up the content:

Text () - sets or returns the text content of the selected element
HTML () - sets or returns the content of the selected element (including HTML markup)
Val () - sets or returns the value of the form field

The following example shows how to set content using the methods text(), HTML (), and val() :

The instance

$("#btn1").click(function(){
$("#test1").text("Hello world!");
});
$("#btn2").click(function(){
$("#test2").html("<b>Hello world!</b>");
});
$("#btn3").click(function(){
$("#test3").val("Dolly Duck");
});

Callback functions for text(), HTML (), and val()

The following example demonstrates text() and HTML () with callback functions:

The instance

$("#btn1").click(function(){
$("#test1").text(function(i,origText){
return "Old text: " + origText + " New text: Hello world!
(index: " + i + ")";
});
});
$("#btn2").click(function(){
$("#test2").html(function(i,origText){
return "Old html: " + origText + " New html: Hello <b>world!</b>
(index: " + i + ")";
});
});