title: Javascript onended is detecting the end of the video
body: <p>Everything in my code works. It just doesn't switch to the next song/video after finishing the current one. I have tried adding an <code>onended</code> event handler (in the  tag and in JavaScript) but failed. I also tried jQuery but it did't work. For some reasons it doesn't change songs at the end of the song. Instead, it will replay the same song over and over again.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;video id="vid" src="main/" playsinline autoplay loop&gt;
    &lt;script&gt;
     var video = document.currentScript.parentElement;
     video.volume = 0.1;  
     var lastSong = null;
     var selection = null;
     var playlist = ["main/songn.mp4", "main/songl.mp4", "/main/songt.mp4", "/main/songf.mp4"]; // List of Songs
     var video = document.getElementById("vid"); 
     video.autoplay=true;
     video.addEventListener("ended", selectRandom); 
  
     function selectRandom(){
      while(selection == lastSong){ 
       selection = Math.floor(Math.random() * playlist.length);
      }
      lastSong = selection; 
      video.src = playlist[selection]; 
  
     }
  
     selectRandom(); 
     video.play();
  
    &lt;/script&gt;
  &lt;/video&gt;</code></pre>
  </div>
  </div>
  </p>