iOS clickable AND selectable events

In iOS, a click event bound to an element breaks copy-and-paste. This is an attempt to get around this problem. See http://stackoverflow.com/questions/9088500/mobile-safari-javascript-click-event-breaks-copy-and-paste

HTML

<div id="clickity" class="button">Click me or select me.</div>
<div id="console" class="button"></div>

CSS

.button{
    padding: 10px;
    border:2px solid blue;
    margin: 10px;
    cursor:pointer;
}
#console{
    height: 300px;
    overflow:scroll;
    font-size: 90%;
    white-space: nowrap;
}

JavaScript

var con = document.getElementById('console');
var button = document.getElementById('clickity');
var dragging = false;
var selection = false;

button.addEventListener('touchcancel',function(ev){
   
    log('<b>touchcancel</b>');
});


button.addEventListener('touchstart',function(ev){
   
    log('<b>touchstart</b>');
});

button.addEventListener('touchmove',function(ev){
    log('<b>touchmove</b>');
    dragging = true;
});

button.addEventListener('touchend',function(ev){
    
    log('<b>touchend</b>');
log(getSelection());
    if(getSelection()){
        log('SELECTION');
    }else if(dragging){
        log('DRAG');
    }else{
        log('CLICK');
    }
    dragging = false;
});

function getSelection(){
    var sel=(document.getSelection()||window.getSelection());
log(sel.rangeCount)
    return sel;
}
function getTime(){
    return new Date().toTimeString().substr(0,8);
};

function log(msg){
    var toPrepend = document.createElement("div");
    toPrepend.innerHTML = getTime() + ': ' + msg;
    con.insertBefore(toPrepend, con.firstChild);
};