8

as said in the title for example:

<input id="User_Type_0" type="radio" name="User_Type" value="1" checked="checked" />
<label for="User_Type_0">User1</label>
<input id="User_Type_1" type="radio" name="User_Type" value="2" />
<label for="User_Type_1">User2</label>

how can I get the text:User 1

piet.t
  • 11,718
  • 21
  • 43
  • 52
Michael
  • 95
  • 1
  • 1
  • 6

5 Answers5

19

$('input:radio:checked').siblings('label:first').html()

UPDATE:

As pointed out by Victor in the comments section the previous selector will always select the first label. The next function should work:

$('input:radio:checked').next('label:first').html()
Darin Dimitrov
  • 1,023,142
  • 271
  • 3,287
  • 2,928
7

how about this?

var forLabel = $('input:radio:checked').attr("id");
$("label[for='" + forLabel + "']").text();
Natrium
  • 30,772
  • 17
  • 59
  • 73
  • 1
    Good general idea, but you'll want to use a different variable name – `for` is a reserved word. – bobince Jan 25 '10 at 13:32
  • if there are more than 1 group, you can select which group you need with the `name`-attribute of the radiobutton – Natrium Jan 25 '10 at 13:51
4

use .next();

$("input:radio:checked").next().text();
Reigel Gallarde
  • 64,198
  • 21
  • 121
  • 139
2

This works for me (I'm was using jQuery Mobile):

var value = $(":radio[name=location]:checked").val();
var text = $(":radio[name=location]:checked").prev("label").text();

The DOM for this:

<div id="locations" data-role="controlgroup" class="ui-controlgroup ui-controlgroup-vertical ui-corner-all">
   <div class="ui-controlgroup-controls ">
      <div class="ui-radio">
         <label for="location0" class="ui-btn ui-corner-all ui-btn-inherit ui-btn-icon-left ui-radio-off ui-first-child">1439</label>
         <input type="radio" name="location" id="location0" value="1439">
      </div>
      <div class="ui-radio">
         <label for="location1" class="ui-btn ui-corner-all ui-btn-inherit ui-btn-icon-left ui-radio-off ui-last-child">1440</label>
         <input type="radio" name="location" id="location1" value="1440">
      </div>
   </div>
</div>
Paul Vargas
  • 41,222
  • 15
  • 102
  • 148
1

What about using the next Adjacent Selector, +?

$('input:radio:checked + label').text();

Here's a Working Demo

Russ Cam
  • 124,184
  • 33
  • 204
  • 266