Javascript 如何使图像隐藏并播放隐藏在其下的视频？

有一个带有背景悬停效果的空白图像（blank.png），可以正常工作。我点击图像，它隐藏了，然后视频div显示出来，这是可行的。我搞不懂的是如何让视频在点击原始空白图像时播放

我有它的大部分工作方式，但不能让视频播放的图像点击

我不是最好的脚本编写者

我所做的一个例子：

$（文档）.ready（函数（）{
$（'.custom th'）。单击（函数（）{
$（'.custom th'）.fadeOut（'fast'，function（）{
$（“#thevideo”）.css（“显示”、“块”）；
});
});
});
#imageID{背景：url(http://edigi.co/Video-Intro.jpg)不重复；
高度：370px；
宽度：100%；
}
#imageID:悬停{
背景：url(http://edigi.co/Video-Intro-Hover.jpg)不重复；
}

非常感谢您的帮助，但由于我不是编写实际示例脚本或编辑JSFIDLE的最佳人选，因此这将是非常棒的

提前感谢您的帮助。

只需添加一个

$（“视频”）。单击（）

像这样：

$(document).ready(function() {
        $('.custom-th').click(function() {
            $('.custom-th').fadeOut('fast', function() {
                $("#thevideo").css("display","block");
                $("video").click();
             });
        });
});

如果页面上有多个视频，请向视频添加id，并在选择器中使用其id而不是“视频”
 非常感谢，我正在尝试：video.addEventListener（'click'，function（）{video.play（）；}非常感谢。@lansen现在他们希望在视频播放后返回图像，以便可以在需要时再次播放。有没有办法做到这一点？我唯一能想到的是刷新页面。只需收听视频触发的事件并将其添加回。请看以下内容：
$(document).ready(function() {
        $('.custom-th').click(function() {
            $('.custom-th').fadeOut('fast', function() {
                $("#thevideo").css("display","block");
                $("video").click();
             });
        });
});