Jquery如何在流式传输下一个视频之前关闭上一个视频？

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

<video id="videoPlayer" controls>
  <source src="video1.mp4" type="video/mp4">
</video>

$(document).ready(function() {
  var videoPlayer = document.getElementById('videoPlayer');
  
  videoPlayer.addEventListener('ended', function() {
    // 视频播放结束时的操作
    loadNextVideo(); // 加载下一个视频
  });
});

function loadNextVideo() {
  var videoPlayer = document.getElementById('videoPlayer');
  
  videoPlayer.pause(); // 暂停当前视频的播放
  videoPlayer.setAttribute('src', 'video2.mp4'); // 更新下一个视频的源文件
  
  videoPlayer.load(); // 加载新的视频
  videoPlayer.play(); // 播放新的视频
}