idealerror
idealerror

Reputation: 675

Targeting a span that is wrapped around a radio input

My problem is fairly simple. I'm using a template to do styling. The way the template handles form inputs is it wraps them in span tags. To select the radio button, you have to change the class of the span to "checked". Using checked="checked" or checked in the input does not work.

Example:

<label class="radio">
<div class="radio" id="uniformed-undefined">
    <span class="checked">
        <input type="radio" name="grow" value="slash">
    </span>
</div>

How can I target that <span class="checked"> based on the input name "grow" and the value "slash" ?

I've looked into .before() but I'm not sure that's the correct answer.

Upvotes: 1

Views: 120

Answers (2)

Kevin Bowersox
Kevin Bowersox

Reputation: 94479

$("span.checked:has(input[name='grow'][value='slash'])")

JS Fiddle: http://jsfiddle.net/RgN7H/1

Upvotes: 1

Kodlee Yin
Kodlee Yin

Reputation: 1089

jQuery multiple attribute selector
and jQuery parent

$("input[name='grow'][value='slash']").parent("span");

Upvotes: 7

Related Questions