Question

I need to wrap a text label in the first column of my table into a span. It seems pretty straight-forward, b ut I seem to be missing something. Here’s what I’ve tried:

$('#myTable tr td:first-child').each(function() {
    var lbl = $(this).val();
    lbl.wrap('<span class="new" />');
}); 

Answer 1

It’s a td and you are wrapping text.. so use contents() – val is for inputs

$('#myTable tr td:first-child').each(function() {
    var lbl = $(this).contents();
    lbl.wrapAll('<span class="new"></span>');
}); 

Or you can use wrapInner() – which does the same thing as above

$('#myTable tr td:first-child').each(function() {
    $(this).wrapInner('<span class="new"></span>');
}); 

Heck, you don’t even have to loop.. just do

$('#myTable tr td:first-child').wrapInner('<span class="new"></span>');

http://jsfiddle.net/wirey00/UcJ49/