[villiwalla]

Добрый день! Подскажите пожалуйста, каким способом можно узнать lenght активного элемента по которому кликнули? Задача в том что бы при клике на увеличенное изображение, появлялось следующие за ним изображение. Добавлять класс на элемент для определения что он сейчас активный и от него +1/-1 не хотелось бы. Ниже как сейчас работает:

<img src="img/image_01_mini.jpg" data-src="img/image_01.jpg" rel="group1" class="lightbox">
<img src="img/image_02_mini.jpg" data-src="img/image_02.jpg" rel="group1" class="lightbox">
<img src="img/image_03_mini.jpg" data-src="img/image_03.jpg" rel="group1" class="lightbox">

var overlay = document.createElement('div');
    overlay.id = 'overlay';
    overlay.style.height = screen.availHeight + 'px';
    document.body.appendChild(overlay);
    var gallery = document.querySelectorAll('.lightbox');

    for (var i = 0; i < gallery.length; i++) {
        gallery[i].addEventListener('click', function () {
            var linkLb = this.getAttribute('data-src');
            overlay.classList.add('show');
            var containLb = document.createElement('div')
            containLb.className = 'lightbox-image';
            containLb.innerHTML = '<img src=' + linkLb + '>';
            overlay.parentNode.appendChild(containLb);
        }, false);
    }

    overlay.addEventListener('click', function hideLb() {
        if (overlay.classList == 'show')
            overlay.classList.remove('show');
        overlay.nextElementSibling.remove('lightbox-image');

    }, false);