how to group the radio button in html with javascript - html

Question

One div should select only one radio button and if one div selects test radio than other div should select taining radio.
<div><label>Test1<input type="radio" value="test" name="test" /></label>
<label>Training<input type="radio" value="training" name="training" /></label>
</div><hr />
<div>
<label>Test<input type="radio" value="test" name="test" /></label>
<label>Training<input type="radio" value="training" name="training" /></label>
</div>
here is the fiddle

Answer 1

Is this what you were looking for?
var rad = document.myForm1.myRadios;
var rad2 = document.myForm2.myRadios;
for(var i = 0; i < rad.length; i++) {
rad[i].onclick = function() {
if(this.value==1){
document.getElementById('f2v2').checked = true;
} else {
document.getElementById('f2v1').checked = true;
}
}
}
for(var i = 0; i < rad2.length; i++) {
rad2[i].onclick = function() {
if(this.value==1){
document.getElementById('f1v2').checked = true;
} else {
document.getElementById('f1v1').checked = true;
}
}
}
<form name="myForm1">
Testing<input type="radio" name="myRadios" value="1" id="f1v1"/>
Training<input type="radio" name="myRadios" value="2" id="f1v2"/>
</form>
<form name="myForm2">
Testing<input type="radio" name="myRadios" value="1" id="f2v1"/>
Training<input type="radio" name="myRadios" value="2" id="f2v2"/>
</form>