When to use jQuery .html or .text on an element

Question

In this question that I posted (and was answered), I found out how to properly assign the value of a textbox to the value of a label. The answer was to use either

$('#txtBranchName').val($('#lblBranchName').html());

or

$('#txtBranchName').val($('#lblBranchName').text());

Is one preferable over the other? Are there performance differences, or would one method not work but the other would in particular situations?

Answer 1

Setting data

.text("<b>Test</b>") will escape any HTML tags (rendering <b>Test</b>)

.html("<b>Test</b>") will render them as actual HTML elements (rendering Test).

Reading data

.text() will return text nodes only (stripping tags)

.html() will return actual HTML string including tags.

---

Here's a JSFiddle that shows the difference both ways.