Overlay image is not working in touch browsers

I’m using below overlay image code in my WordPress single.php file.

<div onclick="myFunction()" id = "xx1" style="position: absolute; width: 209px; height: 607px; z-index:400" >
        <img src = "https://i.imgur.com/YqqQj2x.png"></img>
    </div> 

 <script>
    function myFunction() {
        element = document.getElementById("xx1");
        img = element.firstChild;
        element.removeChild(img);
    }
    </script>

My problem is that Overlay image is not working in touch browsers, Can anyone help me to modify the code to work with touch browsers(Mobile browsers).