<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet">
<div class="container mt-4">
<h3>Bootstrap Enable Disable Radio Button</h3>
<input class="form-check-input" type="radio" id="radioBtn1" name="hospital"
value="Massachusetts General Hospital">
<label class="form-check-label" for="radioBtn1">Massachusetts General Hospital</label>
<input class="form-check-input" type="radio" id="radioBtn2" name="hospital" value="Johns Hopkins Hospital">
<label class="form-check-label" for="radioBtn2">Johns Hopkins Hospital</label>
<input class="form-check-input" type="radio" id="radioBtn3" name="hospital" value="Mayo Clinic">
<label class="form-check-label" for="radioBtn3">Mayo Clinic</label>
<button class="btn btn-primary mr-2" onclick="disableRadioButton()">Disable</button>
<button class="btn btn-danger" onclick="enableRadioButton()">Enable</button>
function disableRadioButton() {
var radioButtons = document.getElementsByName("hospital");
for (var i = 0; i < radioButtons.length; i++) {
radioButtons[i].disabled = true;
function enableRadioButton() {
var radioButtons = document.getElementsByName("hospital");
for (var i = 0; i < radioButtons.length; i++) {
radioButtons[i].disabled = false;