jQuery: Find next element that is not a sibling

Question

Let\'s say I have following HTML:

    X1


    
        

        

Answer 1

Select all elements with class x, calculate the index of the current element and get the element with the index + 1:

var $x = $('.x');
var $next = $x.eq($x.index(this) + 1);

This works because elements are selected in document order. You only have to select all .x elements once on page load (if they are not dynamically created).