How can I change the js code so that the capture goes to a specific video?

Question

JavaScript

var videos = document.getElementsByTagName("#video"),
        fraction = 0.8;
        function checkScroll() {

            for(var i = 0; i < videos.length; i++) {

                var video = videos[i];

                var x = video.offsetLeft, y = video.offsetTop, w = video.offsetWidth, h = video.offsetHeight, r = x + w, //right
                    b = y + h, //bottom
                    visibleX, visibleY, visible;

                    visibleX = Math.max(0, Math.min(w, window.pageXOffset + window.innerWidth - x, r - window.pageXOffset));
                    visibleY = Math.max(0, Math.min(h, window.pageYOffset + window.innerHeight - y, b - window.pageYOffset));

                    visible = visibleX * visibleY / (w * h);

                    if (visible > fraction) {
                        video.play();
                    } else {
                        video.pause();
                    }

            }

        }

        window.addEventListener('scroll', checkScroll, false);
        window.addEventListener('resize', checkScroll, false);
        </script>

there is a code that starts playing the video at the moment when it appears in the window, but what's the problem, if there is still a video on the page, then the second one no longer works because js reads this tag, is it possible to change the code so that it reads by id=" video"

Answer 1

So just change the tags for the video.

Answer 2

There can be only one id, so you need to use classes! Be sure to read about each() array iteration;
And so everything works, you just need to search by class.

var videos = document.getElementsByTagName("#video"), // так не будет робить
var videos = document.getElementsByTagName("video"), // а так кстати будет))))