tags:

views:

2419

answers:

3

I have a form with several checkboxes and labels, most of the functionality is working correctly, but I'm having trouble getting the label value for the checkbox, while stripping out a 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 the label element, but without the span.date. How can I remove this? I've tried the following:

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

That didn't work, neither did the following:

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

How can I only remove the span element, leaving the label text alone for later usage?

Edit: Here's the whole (messy) 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');
            }
        });
    }
});
+1  A: 
$('span.date', my_label).remove();
Alex Barrett
This won't work, as I use the my_label object for the label, eg. $(my_label + ' span.date') won't work.
rebellion
I should've examined your extract more thoroughly! Try it now.
Alex Barrett
Thanks for helping anyway! :)
rebellion
+2  A: 
var lbl = $("label");
var newLbl = $(lbl[0].outerHTML);
$("span", newLbl).remove();
alert(newLbl.text());
Josh Stodola
This will somehow only return "Oct 1", the contents of the span, not the label content itself.
rebellion
No. Try it again. I tested it and it works. I made some edits so perhaps you missed it.
Josh Stodola
Wow, thanks! I must have missed something, because this worked! :D
rebellion
A: 

this works to get the span content , can anyone please tell me how to get the remaining content except that span.date content

je