JSFiddle - React, Tailwind, and code Playground

HTML

<input type="radio" id="radio1" name="radios" value="all" checked>
   <label for="radio1">Credit Card</label>
                   
<input type="radio" id="radio2" name="radios"value="false">
   <label for="radio2">Debit Card</label>

<input type="radio" id="radio3" name="radios"value="false">
   <label for="radio3">Internet Banking</label>
    
    <form id="frm1">
        <input type="text" placeholder="1"/>
    </form>
        <form id="frm2">
            <input type="text" placeholder="2"/>
</form

CSS

.hide
{
    display:none;
}

JavaScript

function hideForm(){
    //its good that ids start with a character a to z
    //add another line with form name if you need
    frm1.className="hide";
    frm2.className="hide";
}
function onClickHide(element){
    document.getElementById(element).onclick=function(){
        hideForm();
    }
}

//write here a line like this with the id of every checkbox that onclick will hide the form's defined at hideForm()
onClickHide('radio1');
onClickHide('radio2');
onClickHide('radio3');