How to change only text node in element

Question

I have next html:

  *
  Name

And I want to chang

Answer 1

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/

Answer 2

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

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

Answer 3

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

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

Answer 4

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');

Answer 5

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/

Answer 6

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 ...