JSFiddle - React, Tailwind, and code Playground

HTML

<div>
	<label><input type="radio" value="apc" name="radios" />apc</label>
	<label><input type="radio" value="ape" name="radios" />ape</label>
	<label><input type="radio" value="aac" name="radios" />aac</label>
	<label><input type="radio" value="aae" name="radios" />aae</label>
	<label><input type="radio" value="cpc" name="radios" />cpc</label>
	<label><input type="radio" value="cpe" name="radios" />cpe</label>
	<label><input type="radio" value="cac" name="radios" />cac</label>
	<label><input type="radio" value="cae" name="radios" />cae</label>
	<label><input type="radio" value="dpc" name="radios" />dpc</label>
	<label><input type="radio" value="dpe" name="radios" />dpe</label>
	<label><input type="radio" value="dac" name="radios" />dac</label>
	<label><input type="radio" value="dae" name="radios" />dae</label>
	<label><input type="radio" value="hpc" name="radios" />hpc</label>
	<label><input type="radio" value="hpe" name="radios" />hpe</label>
	<label><input type="radio" value="hac" name="radios" />hac</label>
	<label><input type="radio" value="hae" name="radios" />hae</label>
	<label><input type="radio" value="lpc" name="radios" />lpc</label>
	<label><input type="radio" value="lpe" name="radios" />lpe</label>
	<label><input type="radio" value="lac" name="radios" />lac</label>
	<label><input type="radio" value="lae" name="radios" />lae</label>
	<label><input type="radio" value="ppc" name="radios" />ppc</label>
	<label><input type="radio" value="ppe" name="radios" />ppe</label>
	<label><input type="radio" value="pac" name="radios" />pac</label>
	<label><input type="radio" value="pae" name="radios" />pae</label>
</div>

CSS

label {
  display: block;
}

JavaScript

var onRadioChange = function (event) {
	alert(event.target.value);
}
var radios = document.getElementsByName("radios");
for (var indice in radios) {
	radios[indice].addEventListener("change", onRadioChange);
}