Javascript-EventListener（“结束”…）不工作

我在一个网页上有一个视频标签，而不是一个iframe，一个导航栏，还有一个div设置为display:none。通过javascript，我试图在视频结束后使其消失。视频设置为autoplay=true，然后在其位置显示一个div（我在开头提到的div），以及更改导航栏中某些文本的颜色。当我让它只删除视频，而不删除其他东西时，它就可以工作。现在，我在事件侦听器之后输入的任何代码似乎都无法工作。我使用alert测试了代码的不同部分，以查看它是否出现故障。代码如下：

    var video=document.getElementById('bg');
    video.addEventListener("ended", afterVideo, false);

    function afterVideo() {
        var video=document.getElementById('bg');
        var gallery=document.getElementById('gallery');
        var galleryText=document.getElementById('galleryText');
        var gLink=document.getElementById('gLink');
        video.removeEventListener("ended", afterVideo, false);
        video.style.display='none';
        gallery.style.display='block';
        galleryText.style.display='block';
        gLink.style.color='#0c8acb';
        }

我把代码放在代码的顶部，但是在body标签之后，我发现这样做对很多人来说是个问题，所以我在底部尝试了一下，但它既没有达到预期效果，也没有像以前那样工作。事件侦听器似乎在视频结束之前很早就被触发，但仍然没有显示隐藏的div，也没有删除视频，但在测试时，每次都会发出警报

以下是相关的HTML：

<div class="fullVideo">
    <video id="bg" autoplay="true" muted="true">
        <source src="video/main6.mp4" type="video/mp4">
        <source src="video/main.ogg" type="video/ogg">
        Your browser does not support video.            
    </video>

    <video id="trans1" muted="true" > 
        <source src="video/trans1.mp4" type="video/mp4">
        <source src="video/trans1.ogg" type="video/ogg">
        Your browser does not support video.            
    </video>

    <div id="gallery">
        <div id="galleryText">
            <p>Text goes here!</p>
        </div>
    </div>
</div>

<nav style="top: 0px;">

    <div id="logo">
        <a href="index.html"></a>
    </div>

    <div id="verticalLine"></div>

    <div>
        <ul>
            <li><a href="#gallery" id="gLink">Gallery</a></li>
            <li><a href="#products" id="pLink">Products</a></li>
            <li class="br"></li>
            <li><a href="#contact.html">Contact</a></li>
            <li><a href="#about.html">About</a></li>
        </ul>
    </div>

    <div id="mNav">
        <br style="clear: left;">
        <p>
            <a href="#gallery">Gallery</a>
            <a href="#products">Products</a>
            <a href="#contact">Contact</a>
            <a href="#about">About</a>
        </p>
        <hr>
    </div>

</nav>

---

更新：事件侦听器似乎在页面加载时被触发，按预期运行所有内容，但随后视频返回到我试图删除的视频，使其看起来好像代码没有做任何新操作…

不确定它是否已连接，但我相信您在var gallery=document.getElementById'galleryText'；中有输入错误；。变量不应该是galleryText吗？我刚刚解决了这个问题，但这不是问题。发布HTML的相关部分。好了。@PM 77-1 id为“galleryText”的元素在哪里？