JSFiddle - React, Tailwind, and code Playground
HTML
<label>
<input type="radio" name="foobar" id="foo" onclick="toggle()">Show first</label>
<label>
<input type="radio" name="foobar" id="bar" onclick="toggle()">Show second</label>
<div id="foo-div">First Elm</div>
<div id="bar-div" class="hidden">Second Elm</div>
CSS
label {
display:block;
}
.hidden {
display:none;
}
JavaScript
function toggle() {
var foo = document.getElementById('foo'),
bar = document.getElementById('bar'),
foodiv = document.getElementById('foo-div'),
bardiv = document.getElementById('bar-div');
if (foo.checked) {
foodiv.className = '';
bardiv.className = 'hidden';
} else {
foodiv.className = 'hidden';
bardiv.className = '';
}
}