(^104) ❘ CHAPTER 4 MANIPULATING CONTENT AND ATTRIBUTES
simply returns the text or HTML content of the fi rst matched element in a jQuery selection. The
following example, Example 4-3, demonstrates how this works:
<!DOCTYPE HTML>
Before I speak, I have something important to say. - Groucho Marx
The preceding document is linked to the following style sheet:
body {
font: 12px "Lucida Grande", Arial, sans-serif;
color: rgb(50, 50, 50);
margin: 0 ;
padding: 15px;
}
The following script demonstrates how you can use the html() and text() methods and what to
expect in the output that you get back:
$(document).ready(
function()
{
console.log('HTML: ' + $('p').html());
console.log('Text: ' + $('p').text());
}
);
Figure 4-8 shows that the html() method has returned the element in the results, but the text()
method has left that out. In this sense, you fi nd that the html() method is similar to the innerHTML
property, and the text() method is similar to the innerText or textContent properties.
Setting Text or HTML Content
Setting content works similarly: All you have to do is provide the content that you want to set
as the value for the element (or elements) in the fi rst argument to the text() or html() method.
Which method you use, of course, depends on whether you want HTML tags to be expanded
as HTML. The following example, Example 4-4, demonstrates how to set text or HTML content:
[http://www.it-ebooks.info](http://www.it-ebooks.info)