JSFiddle - React, Tailwind, and code Playground
HTML
<div id="USAPubHealthYesNo" >
<ol type="a" class="indentList">
<li>
<input name="rbPubHealthYesNo" type="radio" class="radiobuttonfield days5" alt="Yes - five (5) day MDR report is required" title="Yes - five (5) day MDR report is required" value="Yes" />Yes - five (5) days MDR report is required
<div id="calc14" class="indentListCalc">
<input id="dt5Days" type="text" class="textfieldCalc labelWidth25" /> </div> </li>
<li><input name="rbPubHealthYesNo" type="radio" class="radiobuttonfield days30" alt="No - thirty (30) day MDR report required" title="No - thirty (30) days MDR report required" value="No" />No - thirty (30) day MDR report required
<div id="calc15" class="indentListCalc"> <input id="dt30Days14" type="text" class="textfieldCalc labelWidth25" /> </div>
</li>
</ol></div>
JavaScript
function changeHandler(el) {
if ( $(el).val() === 'Yes' ) {
document.getElementById('calc14').style.display = 'block'; date5Days();
} else if ( $(el).val() === 'No' ) { document.getElementById('calc15').innerHTML = '';
date30Days14(); }
}
$('input[type=radio]').on('change', function() {
changeHandler($(this));
});
function date30Days14(){
var dt = new Date();
dt.setDate( dt.getDate() + 30 );
var mo = dt.getMonth() + 1; // JS months are 0 to 11, so need to add 1
var dy = dt.getDate();
var yr = dt.getYear() % 100; // just to make sure only 2 digit year
var dueDate = (mo < 10 ? "0" : "" ) + mo + "/" + ( dy < 10 ? "0" : "" )
+ dy + "/" + (yr < 10 ? "0" : "" ) + yr;
var text = "30 days from today is ";
document.getElementById('calc15').innerHTML = text + dueDate;
}
function date5Days(){
var dt = new Date();
dt.setDate( dt.getDate() + 5 );
var mo = dt.getMonth() + 1; // JS months are 0 to 11, so need to add 1
var dy = dt.getDate();
var yr = dt.getYear() % 100; // just to make sure only 2 digit year
var dueDate = (mo < 10 ? "0" : "" ) + mo + "/" + ( dy < 10 ? "0" : "" )
+ dy + "/" + (yr < 10 ? "0" : "" ) + yr;
var text = "5 days from today is ";
document.getElementById('calc14').innerHTML = text + dueDate;
}