onclick works on this radio button restyle, but onmousedown doesn't - css

Question

I have a set of radio buttons, and everything works fine when onclick is used, but when onclick is replaced with onmousedown (or ontouchstart, tested in developer mode), checked+label works fine, but the alert requested in the HTML doesn't. The reason why I want to replace onclick (with ontouchstart) is to improve the performance of a hybrid app in IOS.
Any clue what my problem is... I've managed to get from zero coding to creating a quite complex physics app in 5 months without posting a single question anywhere, and I quite embarrassed by this one!
Here's the HTML:
<div class="switch-field1">
<input type="radio" id="sine1" name="switch_3" onclick = "alert('This works fine')" checked/>
<label for="sine1"> SINE </label><br>
<input type="radio" id="square1" name="switch_3" onmousedown = "alert('If I see this, problem solved')"/>
<label for="square1"> SQUARE </label><br>
<input type="radio" id="triangle1" name="switch_3" onclick = "alert('This works fine')"/>
<label for="triangle1"> TRIANGLE </label>
</div>
Here's the CSS:
.switch-field1 {
font-family: "sans-serif", Tahoma, Verdana, Lucida ;
padding: 0px;
overflow: hidden;}
.switch-title1 {
margin-bottom: 3px;
margin-left: 0px}
.switch-field1 input {
position: absolute !important;
clip: rect(0, 0, 0, 0);
height: 1px;
width: 1px;
border: 0;
overflow: hidden}
.switch-field1 label {
float: left;}
.switch-field1 label {
display: inline-block;
width: 100%;
background-color: #e6ffe6;
color: black;
font-size:11px;
text-align: center;
border: 1px solid rgba(0, 0, 0, 0.2);}
.switch-field1 input:checked + label {
font-weight: bold;
font-size: 12px;
color: white;
background-color: #009900;}

Answer 1

The onmousedown event works, but only on the radio button, not on the label.
You should attach an event listener to the label itself, like:
<label for="square1" onmousedown="alert('If I see this, problem solved')">SQUARE</label>
Update:
The ontouchstart with function call worked for me, but you need to use it on touch capable 'device', I used the chrome device toolbar under dev tools (ctrl+shift+j, mobile icon at top left).
I used this function:
function whichbuttonID(){
// need js to select the option
document.getElementById("squarel").checked = true;
alert('Ok');
}