媒体元素。js:单击视频时显示控制面板

我想只在单击(播放事件)视频时显示“控件”面板。

我已经隐藏了“.mejs控件”:

CSS格式

.mejs-controls{ visibility:hidden; }

并设置以下内容:

JS文件

$('video,audio').mediaelementplayer({
    alwaysShowControls: true,
    success: function (mediaElement, domObject) {
        mediaElement.addEventListener('play', function(e) {
            $('.mejs-controls').css("visibility", "visible");
        }, false);
    }
});

这对我来说很有用,但如果我的页面上有多个玩家,它会显示该页面上每个玩家的控件。我如何避免这种情况,并仅在我单击的播放器中显示控件?

更新

这个 HTML格式 很简单:

<div class="video-wrapper">
                    <video src="images/video/video.mp4" poster="images/video/poster.jpg"></video>
                </div>