ocultar un radio boton y que sirva para selecionarlo de manera oculta

[jeshua3001]

ok si sirven para los radio pero la imagen se comporta diferente, como se puede modificar para que las imagenes se seleccione con el radio si el radio o esta seleccionado se deseleccione la imagen

<style type="text/css">.boxes {display: none; }</style>
<script type="text/javascript">


function testchk(){
var valor = document.getElementById('chk_id').checked;
var valor2 = document.getElementById('chk_id2').checked;
alert(valor + '-' +valor2);
}
function check(checkboxid,imag,reemplazo,defecto) {
var valor = document.getElementById(checkboxid).checked;

if (valor == false){
document.getElementById(checkboxid).checked = true;
document.getElementById(imag).src = reemplazo;
}else{
document.getElementById(checkboxid).checked = false;
document.getElementById(imag).src = defecto;
}
}
</script>

<img src="checkboxbg.gif" onclick="check('chk_id',this.id,'checkboxbg2.gif', 'checkboxbg.gif');" width="110" height="150" alt="" id="uno" />
<img src="checkboxbg.gif" onclick="check('chk_id2',this.id,'checkboxbg2.gif' ,'checkboxbg.gif');" width="110" height="150" alt="" id="dos" />

<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="get">
<p class="boxes">
<input class="checkbox" type="radio" id="chk_id" name="preferencias[]" value="internet" />
<input class="checkbox" type="radio" id="chk_id2" name="preferencias[]" value="deportes" />
</p>
<p>
<br />
<input type="submit" name="procesar" value="enviar"/>
</p>
</form>
<p>
<br />
<a href="#" onclick="testchk();">Verificar</a>
</p>

<?php

if(isset($_GET['procesar'])){

$prefs = $_GET['preferencias'];
if(!empty($prefs)){
echo "tus preferencias son: <br />";
$N = count($prefs);
for($i=0; $i < $N; $i++){
echo $prefs[$i] . "<br />";
}
}

}
?>

aqui podemos seleccionar ambas imagenes como lo haria con checkbox pero con radio se deberia seleccionar una sola imagen de acuerdo a radio que este seleccionado