Load video in toggled window via text link

[Gilead]

I have a number of video clips that I want to load via text links. I have the toggle function working, but now I want to show a different video when you click on its link.
Text link --> click<-- popup video here
Text link --> click<-- popup video here in same window

I haven't used javascript for much so since the language has evolved, I've fallen behind.

<script type="text/javascript">
  function toggle()
 {
   var videoID=document.getElement
 var trailer=document.querySelector(".trailer");
 var video=document.querySelector("video");
 trailer.classList.toggle("active");
 video.pause();
 video.currentTime=0;
 }
 </script>

 <div class="banner">
   <div class="content">
  ID002: <a href="#" onclick="toggle("ID002");">2/7/2022</a>
  </div>
 </div>
 <div class="trailer">
   <video src="2202-07-ID002.mp4" controls="true"></video>
  <img src="close.png" class="close" onclick="toggle()" alt="" title=""/>
  
 </div>

I want to be able to change the video to be played by the id passed into the function, after that I'm a bit lost.
Someone show me what I need?
Thanks!

[NickMNS]

First let me ask why a link? The functionality you describe is that of a button, a link is supposed to take you somewhere else, and it includes attributes such as "href" that are not needed and need to be dealt with and it is missing needed attributes such as name and value. Instead use a button and style it so that it looks like a link if you really want to, but really even users expect a link to take them somewhere else:

So using buttons:

<!-- html -->
<button value="some-video1.mp4" onClick="playVideo(event)">popup video 1 here!</button>
<button value="some-video2.mp4" onClick="playVideo(event)">popup video 2 here!</button>
<video class="hide" id="myvideo" src="null" controls="true"></video>
<button class="hide" id="closeBtn" class=".hide" onClick="playVideo(event)">Close Video</button>

<!-- css-->
.show { display: block;}
.hide { display: none;}

<!-- js -->
<script>
console.log(document.querySelector("#myvideo").src)
function playVideo( event ) {
 const src = event.target.value;
 const video = document.querySelector("#myvideo")
 const close = document.querySelector("#closeBtn")
 video.setAttribute("src", src)
 video.pause();
 video.currentTime=0;
 video.className = src ? 'show' : "hide"; 
 close.className = src ? 'show' : "hide"; 
 console.log(video.src);
}
</script>

Demo:
[jsfiddle.net...]

Note for the close button, you can use CSS to style the button such that your image is used to style the background of the button making it appear as an image but function like a button.

[Gilead]

THANK YOU SOOOOO MUCH!