How can I change a label text without interfering with an input radio inside the label?

Question

In my html template I've got a label with an input radio inside:

<label id="myid" class="inline">
    <input type="radio" value ="11"> 
    my text
</label>

I need to change the text of the label with jquery. I tried this:

$('#myid').html('my new text');

or

$('#myid').text('my new text');

but when I do that I lose my input radio. How can I preserve the input radio inside the label and modify label's text?

`$('#myid input').get(0).nextSibling.nodeValue = 'my new text';` — adeneo, Aug 18 '14 at 16:15

score 11 · Accepted Answer · answered Aug 18 '14 at 16:03

11

Try this:

$('#myid').contents().last().replaceWith('my new text');

answered Aug 18 '14 at 16:03

antyrat

score 6 · Answer 2 · answered Aug 18 '14 at 16:05

6

Put your text in a span and try this:

<label id="myid" class="inline">
    <input type="radio" value ="11">
    <span>my text</span>
</label>

$('#myid').find("span").text('my new text');

answered Aug 18 '14 at 16:05

Moshtaf

2 Answers2