Есть несколько видео на странице, сделал включение/выключение видео по клику на кнопку или само видео. Если на странице несколько видео, то включается/выключается только первое. Хотелось бы получить универсальную функцию, которая будет работать не через ID видео (не хотелось бы одни и те же идентификаторы на одной странице иметь) и включать/выключать только конкретное видео соответственно.
var video;
window.onload = function() {
video = document.getElementById("video");
}
$(document).on('click', '.PlayPauseVideo', function() {
if (video.paused) {
video.play();
} else {
video.pause();
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="video_with_link">
<video id="video" width="380px" height="250px" src="video/videoplayback.mp4" class="PlayPauseVideo"></video>
<input type="button" class="PlayPauseVideo">
</div>
<div class="video_with_link">
<video id="video" width="380px" height="250px" src="video/videoplayback.mp4" class="PlayPauseVideo"></video>
<input type="button" class="PlayPauseVideo">
</div>
<script>
</script>