Edit in JSFiddle

$(document).ready(function() {

    var log = $("#log");
    var touchMe = $("#touchMe");
    
    touchMe[0].ontouchstart = function(e) {        
        log.html("Touch Start");
        var touche= e.touches[0]; 
        //instead of e.clientX, in touch event we have to acess like this    e.touches[0].clientX.
        log.append("X :" + touche.clientX + "Y :" +touche.clientY);
        log.append("</br>");
    }    
    
    touchMe[0].ontouchmove = function(e) {       
       log.html("Touch Move");
        var touche= e.touches[0]; 
         //instead of e.clientX, in touch event we have to acess like this    e.touches[0].clientX.
        log.append("X :" + touche.clientX + "Y :" +touche.clientY);
        log.append("</br>");
    }  
    
    touchMe.bind("touchend", function(e) {
      log.html("LOG");
    });
});

Touch and move finger the yellow region
<div id="log">LOG </div>
<!--  <button id="clickMe">clickMe</button>-->
<div id="touchMe"></div><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><p><font size="3"><b>Source for this<a  target="_blank"href="http://jqfaq.com/how-to-get-the-xy-coordinates-in-touch-events/"</a> JQFaq Question</b></font></p>
<iframe id="iframe1" src="http://jqfaq.com/AdPage.html" style="width:100%;border:none;" />

#touchMe
{
    background-color: #E9F115;
    border: 2px solid gray;
    height: 400Px;
    width: 400px;
    top: 52px;
    position: absolute;
    left: 300px;
}
#log
{
    width: 150px;
    border: 2px solid darkOrange;
    font-size:x-small;
}