How to change only text node in element

I have next html:

<label for="user_name">
  <abbr title="required">*</abbr>
  Name
</label>

And I want to change label caption to Title with jquery. So I do

$('label[for=user_name]').html('Title')

And it replaces all inner html (including abbr tag)

So, what's the easiest way to replace only Name?

If you use contents() method it will also return text nodes. Since jQuery doesn't have text node methods, convert last node to a DOM node

$('label[for="user_name"]').contents().last()[0].textContent='Title';

Demo: http://jsfiddle.net/yPAST/1/

Sorry for the late reply... But here is a way to do so using only jQuery:

$('label').contents().last().replaceWith('Title');

It may not be the prettiest way, but this works:

var $label = $('label[for=user_name]');
$label.html($label.html().replace("Name", "Title"));

You can select only the abbr element, store it, and then replace the whole content with the stored element plus the changed caption:

​$('label[for="user_name"]').each(function(){
   var a = $(this).children('abbr');
   $(this).html(a).append('Title');
});

See this **fiddle**​

you can use replace accomplish this

  var html = $('label[for=user_name]').html().replace('Name','Testing');
  $('label[for=user_name]').html(html);

check it : http://jsfiddle.net/DyzMJ/

Evans solution added to jquery fn to make it's use comfortable:

// get/change node content not children
jQuery.fn.content = function( n ){
    var o = $(this).clone();
    var c = o.children().remove();
    if (typeof n === "string" ){
        o.html(n);
        $(this).html(c).append(n);
    }
    return o.html();
}

Usage :$('myselector').content('NewContentString');

This is the solution that worked for the most browsers

$('label[for="user_name"]').contents().last()[0].nodeValue = 'Title';

This one came close but gave issues in ie8 since textContent is not supported

$('label[for="user_name"]').contents().last()[0].textContent='Title';

if you are manipulating more than 1 label you can select each label and replace text with jquery:

$('label[for="user_name"]').contents().last().replaceWith("Title");

and for the second label :

$('label[for="user_lastname"]').contents().last().replaceWith("Title2");

and so on ...