Find the number and position of elements in HTML using JavaScript

Question

How would I, using JavaScript, find this out:

Say I have this HTML:

<element1></element1>
<element2></element2>
<element2></element2>

I would like to detect if there are 2 "element2" elements after my "element1" element. Also, they are not always next to each other.

How would I do this?

Answer 1

I would like to detect if there are 2 "element2" elements after my element1 element. Also, they are not always next to each other.

Assuming element1 is a div and element2 is a span ...

var element = document.getElementsByTagName('div')[0],
    spanCount = 0;

while (element = element.nextSibling) {
    if (element.tagName == 'SPAN') {
        spanCount++;
    }

    if (spanCount == 2) {
        alert('There are 2 spans following!');
        break;
    }
}

jsFiddle .

Answer 2

Easy with jQuery:

 $('element1').nextAll('element2').size()

See http://api.jquery.com/category/traversing/