Hide radio button while keeping its functionality

I have tried several methods but it seems that using display:none or visibility:hidden makes the radio function useless.

But it works. Maybe you didn't set for attribute:

<input id=radio1 name=testradios type=radio><label for=radio1>radio1</label>
<br>
<input id=radio2 name=testradios type=radio><label for=radio2>radio2</label>

#radio1 {
    display: none;
}

OR

#radio1 {
    visibility: hidden;
}

Both hide radio button but label is still clickable and checks its radiobutton.

http://jsfiddle.net/m0fbd75w/

In Angular, display:none or visibility:hidden didn't work for me. Instead, I used:

input[type=radio] {
  opacity: 0;
}