CODEWITHSUNDEEP
javascriptjqueryhtmldom
cppit
cppit

Reputation: 4564

jquery addclass to the clicked radio button span

I have the following html code:

<div class="tests">
    <input name="premise" id="premise" type="radio" class="required" value="0"><span>0</span>
    <input name="premise" type="radio" class="required" value="1"><span>1</span>  
    <input name="premise" type="radio" class="required" value="2"><span>2</span>
    <input name="premise" type="radio" class="required" value="3"><span>3</span>
    <input name="premise" type="radio" class="required" value="4"><span>4</span>
    <input name="premise" type="radio" class="required" value="5"><span>5</span>      
    </div>

here is the jquery I am using that unfortunately doesn't work: jQuery("#premise").children().addClass('redtext');

I am trying to add the class redtext to the clicked radio box. so if you click on radio with the value=1, then the number 1 that can be found inside the span will be in red

Upvotes: 1

Views: 338

Answers (2)

Geoffrey Litt
Geoffrey Litt

Reputation: 160

You're misusing the jQuery children() operator. children() operates on children of an element in the DOM tree, but in this case the span which you're trying to add a class to is a sibling of the <input> tag, not a child. So

$("#premise").next().addClass('redtext');

should add the class to the closest sibling after the <input> in the DOM tree, which is the <span> you're looking for.

Upvotes: 1

elclanrs
elclanrs

Reputation: 94101

Well, <span> is not a child of <input> in your code... you can change children with next This should work:

$('#premise').next().addClass('redtext');

Upvotes: 1

Related Questions