How to have multiple vidstack players on one page?

I need to set up vidstack player this way

<zzVideo class="zzVideo" data-src="youtube/ssvK18GSsEA"></zzVideo>

Now I am trying to figure out how to intialize multiple player on one page. I came up with this code. I am sure that real programmers would correct me.

var players = [];

[...document.getElementsByTagName("zzVideo")].forEach((element, i) => {
//    console.log(element.dataset.src + ' - '+i);
    element.id = "zzVid"+i;
   
players[i] = VidstackPlayer.create({
         target: '#zzVid'+i,
         title: 'Video #'+1,
         src: element.dataset.src,
      //    poster: 'https://files.vidstack.io/sprite-fight/poster.webp',
         layout: new VidstackPlayerLayout({
      //      thumbnails: 'https://files.vidstack.io/sprite-fight/thumbnails.vtt',
         }),
       });
  });

Can you please help me to have better solution? Working jsfiddle is here https://jsfiddle.net/radek/o9bs7qv5/55/