Removing HTML tag from string using jQuery

Question

I have a form with several flags and labels, most of the functionality works correctly, but I can’t get the label value for this flag by deleting the span element inside the label:

<input type="checkbox" id="list-item-x" /> <label for="list-item-x"><span class="date">Oct 1</span> The checkbox label</label> 

I want a label element, but without span.date . How can i remove this? I tried the following:

 $('label').remove('span.date').text(); 

This did not work, and the following was not done:

 $('label').find('span.date').text(); 

How can I remove only the span element, leaving the label text one for later use?

Edit: Here is the whole (dirty) code:

 $('input.list-item-checkbox').live('click', function(){ var myself = $(this); var my_id = $(myself).attr('id').split('-', 3); my_id = parseInt(my_id[2]); var my_label = $(myself).parent().children('label').html(); var parent = $(myself).parents('.list-item'); if ($(this).is(':checked')) { $.ajax({ type: 'POST', url: CI.base_url + 'ajax/unfinished_item/', data: 'list-item=' + my_id, dataType: 'json', success: function(result){ if (result.status == 'ERROR') { alert('Could not edit item'); } else { var html_string = '<div class="list-item">' + ' <input type="checkbox" class="list-item-checkbox" id="list-item-' + my_id + '" /> ' + ' <label for="list-item-' + my_id + '">' + my_label + '</label>' + '</div>'; $(myself).parents('.list-finished').siblings('.list-items').append(html_string); $(myself).parents('.list-item-finished').remove(); // This is where I need to get the span element removed from the label } }, error: function(){ alert('No contact with server'); } }); } }); 

Answer 1

 var lbl = $("label"); var newLbl = $(lbl[0].outerHTML); $("span", newLbl).remove(); alert(newLbl.text()); 

Answer 2

 $('span.date', my_label).remove();