Javascript 如果未选中收音机，则禁用按钮。选中时启用

禁用按钮后，我似乎无法使其重新启用。当前，如果未选中任何内容，并且我将鼠标悬停在其上，则该按钮将禁用。若我检查了某些内容，它将保持启用状态，但若我首先将鼠标悬停在按钮上，但并没有检查任何内容，若我检查了某些内容，我将无法使它重新启用

以下是我的JS：

var inputs = document.getElementsByTagName('input');
var letsCookButton = document.querySelector('#letsCook');

letsCookButton.addEventListener('mouseover', checkIfChecked);

function checkIfChecked() {
  letsCookButton.disabled = true;
  for (var i = 0; i < inputs.length; i++) {
    if (inputs[i].checked) {
      letsCookButton.disabled = false;
    }
  }
}

var inputs=document.getElementsByTagName（'input'）；
var letsCookButton=document.querySelector（“#letsCook”）；
letsCookButton.addEventListener（'mouseover'，checkIfChecked）；
函数checkIfChecked（）{
letsCookButton.disabled=true；
对于（变量i=0；i

这是我的HTML：

div class="mainBox" id="box-one">
          <p id="left-box-title">What are you looking for?<span>*</span></p>
          <ul>
            <li><input type="radio" name="food" id="side-food"> Side</li>
            <li><input type="radio" name="food" id="main-food"> Main Dish</li>
            <li><input type="radio" name="food" id="dessert-food"> Dessert</li>
            <li><input type="radio" name="food" id="entire-meal"> Entire Meal</li>
          </ul>
          <button id="letsCook">LET'S COOK!</button>
        </div>

div class=“mainBox”id=“box one”>
您在寻找什么*

侧面
主菜
甜点
整顿饭

让我们做饭吧！

你必须稍微重新思考一下你希望应用程序的用户体验如何工作，因为

由于在第一次单击后，至少有一个单选按钮将保持选中状态，因此我建议从一开始就禁用该按钮，然后在单选单击事件中启用它

您在寻找什么*

侧面
主菜
甜点
整顿饭

让我们做饭吧！

var-inputGroup=document.querySelector（“#无线电组”）；
var letsCookButton=document.querySelector（“#letsCook”）；
inputGroup.addEventListener（'click'，函数（）{
letsCookButton.removeAttribute（“已禁用”）
});

JS Fiddle中的工作示例：