Question

I am trying to make a basic captcha module for jQuery. I have a decent start on it, but for some reason .children() doesn’t seem to work. See it here: http://jsfiddle.net/pTbeW/
I currently have this:

$(this).children('.captchain-start').hide();
$(this).children('.captchain-show').show();

If I change it to

$('.captchain-start').hide();
$('.captchain-show').show();

it works perfectly. But this solution is less than ideal, because it wouldn’t allow two instances of this captcha to be on the same page. I suspect it has to do with the html being set by query, but I’m not sure how. I’m far from a javascript and jQuery expert, but this seemed like a relatively easy thing to do. What am I missing? Do I have tired eyes from looking at it so long? Any help would be appreciated.

Answer 1

You should use $(this).nextAll() instead of $(this).children() because the elements you want to hide and show are not children of the a element, but siblings.

See http://api.jquery.com/nextAll/