problem with selecting parent element
Hi all,
I am doing a form with hidden fields which will be fired by select boxs or radio buttons,
all the hidden fields are wrapped by <span>
the problem is when the hidden field is next to select box like this:
EXAMPLE1
<label>Title: </label>
<select name="title" id="titleSelect">
<option value="">Please select a title</option>
<option value="Mr">Mr</option>
<option value="Mrs">Mrs</option>
<option value="Ms">Ms</option>
</select>
<br/>
<span><br/> <label>Please specify:</label><input type='text' size='30' /></span>
$(this).next('span').show(); WORKS!!
$(this).next().show(); WORKS!!
EXAMPLE2
<
div class="selection"><input name="postGraduate" value="postgraduateYes" type="radio""/>Yes</div>
<
div class="selection"><input name="postGraduate" value="postgraduateNo" type="radio" "/>No</div>
<span><br/> <label>Please specify:</label><input type='text' size='30' /></span>
$(this).next('span').show(); DOES NOT WORK :(
$(this).next().show(); DOES NOT WORK :(
$(this).parent().next('span').show(); DOES NOT WORK :(
$(this).parent().next().show(); DOES NOT WORK :(
$(this).parent().next().next().show(); WORKS, but when you click 'No' , it removes the wrong element.
What I want to do is targeting the next 'span' of current element, Can I possibly do that????
and have the statement like this
if(statement){
$(this).next('span').show();
}else{
$(this).next('span').hide();
}
BUT THIS DOES NOT WORK ON RADIO BUTTONS,
PLEASE HELP!!!
