Div verschwindet nicht mit Onclick-Event auf Handy?

Question

Wenn ich auf den Playbutton/div auf meinem Desktop klicke, verschwindet das div videotekst aber wenn ich auf das div auf meinem Handy klicke, verschwindet div videotekst nicht.

Hier ist mein Code ich verwende:

<div class="overInreach"> <video id="my-video" class="video-js" controls preload="auto" width="100%" height="427px" 
    poster="MY_VIDEO_POSTER.jpg" data-setup="{}" onended="videoEnded()"> 
    <source src="<?php echo get_template_directory_uri(); ?>/images/Inreach_Promo_v2.mp4" type='video/mp4'> 
    <p class="vjs-no-js"> 
     To view this video please enable JavaScript, and consider upgrading to a web browser that 
     <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a> 
    </p> 
    </video> 

    <script src="http://vjs.zencdn.net/5.8.8/video.js"></script> <script> 
     $(document).ready(function() 
     { 
      $(".vjs-big-play-button").click(function() 
      { 
       $("#videotekst").css("z-index", "-1"); 
     $(".vjs-big-play-button").css("display", "none !important"); 
     $(".vjs-control-bar").css("display", "flex !important"); 
      }); 
      $(".vjs-poster").click(function() 
      { 
       $("#videotekst").css("z-index", "-1"); 
     $(".vjs-big-play-button").css("display", "none !important"); 
     $(".vjs-control-bar").css("display", "flex !important"); 
      }); 
     }); 
    </script> 

    <script> 
function videoEnded() { 
    $("#videotekst").css("z-index", "1"); 
    $(".vjs-big-play-button").css("display", "block"); 
    $(".vjs-control-bar").css("display", "none"); 
} 
    </script> 

Answer 1

Da bei mobilen gibt es nicht Ereignis klicken. gibt es Berührungsstart und touchEnd Veranstaltungen gibt es:

kann wie So versuchen:

var clickHandler = ('touchend' in document.documentElement ? "touchend" : "click"); 

$(".vjs-big-play-button").bind(clickHandler, function(e) { 
    alert("clicked or tapped. This button used: " + clickHandler); 
});