Reputation: 612
Using jQuery, how do I find the first occurring element of a certain type after a given element ID? The desired element may or may not be the element immediately after.
The aim of the function below is to hide the first occurring element of type 'select' after the radio button.
function showDropDown(radioButtonElem) {
if(document.getElementById(radioButtonElem.id).checked) {
/*$(Get next <select> element after radioButtonElem.id).css("display", "none");*/
}
}
<input type="radio" name="radioButtonGroup" value="sfn" id="sfn" onclick="showDropDown(this);">
<select id="myDropDown">...</select>
My understanding of the 'next()' function is that it only finds elements of the same type. I may be wrong; if I am please explain how to use it to solve my problem.
EDIT: Thanks for feedback all. Based on your input, I thought this would work, but it doesn't. What am I missing?
<script>
function showDropDown(radioButtonElem)
{
if(radioButtonElem.checked)
{
$(radioButtonElem).nextAll('select').first().css('display', 'none');
}
}
</script>
Upvotes: 2
Views: 2471
Reputation:
Try this or use below
var getNextTD = $('table.listview').nextAll('td').not('[class]').first();
Upvotes: 0
Reputation: 339816
If the required element is a sibling, just not necessarily the immediately following sibling, you can use .nextAll()
followed by .first()
$(this).nextAll('select').first()
Also - you have jQuery - you should use it for the event handling too:
function showDropDown(ev) {
if (this.checked) {
$(this).nextAll('select').first().hide();
}
}
$(':radio').on('click', showDropDown);
See http://jsfiddle.net/alnitak/RsrwV/
Upvotes: 1