Question

For some strange reason, whenever I have a selector and expect to get multiple items, jQuery is only returning the first item, instead of the entire collection.

This is the HTML I have:

<a id="reply-424880" class="reply" href="#" rel="nofollow">Reply</a>
<a id="reply-424885" class="reply" href="#" rel="nofollow">Reply</a>

And the selector:

$('.reply').unbind('click').click(function(event) {
 ...
}

I have tried debugging using FireBug, and still get the same results. Using the work around I can get it to work:

$('a').each(function (index, element) {
            if ($(element).attr('class') == 'reply') {
                $(this).unbind('click').click(function(event) {
                     ...
                });
             }
});

I would like to use the built-in functionality instead of my work around. Any idea why only the first element would be returned?

Answer 1

After leaving the workaround in place for a couple of months, I decided to try to see if there was anything on the page that was causing the problem.

By process of elimination, I was able to narrow down the error to the jquery.validate.js file. For some unknown reason, this file was causing the jQuery to only return the first value. I downloaded the latest version and the selectors now return all the elements that match.