JSFiddle - React, Tailwind, and code Playground
HTML
<div id="eligible">
<div class="box">
<fieldset>
<input type='radio' name='q1' id='one' value='Yes'>
<input type='radio' name='q1' id='two'
value='No'>
</fieldset>
4</div>
<div class="box">
<fieldset>
<input type='radio' name='q2' id='three' value='Yes'>
<input type='radio' name='q2' id='four'
value='No'>
</fieldset>
5</div>
<div class="box">
<fieldset>
<input type='radio' name='q3' id='five' value='Yes'>
<input type='radio' name='q3' id='six'
value='No'>
</fieldset>
6</div>
<div class="success">Success</div>
<div class="failed">Failed</div>
</div>
CSS
.box {width:100px;height:100px;border:1px solid #ccc;margin:10px;padding:10px;float:left;}
.success {width:200px;float:left;height:100px;background:green;color:#fff;display:none}
.failed {width:200px;float:left;height:100px;background:red;color:#fff;display:none}
JavaScript
$("#six, #five, #four, #three, #two, #one").click(function() {
if($("#two").is(":checked")) {
$(".success").hide();
$(".failed").show();
} else {
if($("#one").is(":checked") && $("#three").is(":checked") && $("#five").is(":checked")) {
$(".success").show();
$(".failed").hide();
}
else {
if($("#one").is(":checked") && $("#three").is(":checked") && $("#six").is(":checked")) {
$(".success").show();
$(".failed").hide();
}
else {
if($("#one").is(":checked") && $("#four").is(":checked") && $("#five").is(":checked")) {
$(".success").hide();
$(".failed").show();
}
else {
if($("#one").is(":checked") && $("#four").is(":checked") && $("#six").is(":checked")) {
$(".success").show();
$(".failed").hide();
}
}}}
}
});