How to get the length of the active element?

Question

JavaScript

Good afternoon! Can you please tell me how can I find out the length of the active element that was clicked on? The task is that when you click on an enlarged image, the image following it appears. We would not want to add a class to an element to determine that it is now active and +1/-1 from it.

<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);

Answer 1

I think the answer is hidden here