Javascript jquery onclick按钮更改选中/取消选中操作旁边的元素背景

下面的代码使每次单击时，所有未禁用的复选框都被选中/取消选中。此外，在第一次点击的背景车父母正在改变为红色

var clicked = false;
    var target = jQuery(".editcheckhour:not(:disabled)");
    jQuery(".checkalledit").click(function() {
    target.prop("checked", !clicked).closest('label').css('background-color','#c00');
    clicked = !clicked;
});     

在下一次单击时，我想重新更改背景色。因此，该函数不仅会选中/取消选中输入，还会交替更改背景中的复选框

在这个JSFIdle演示中，只需首先单击“更改背景”

---

有人帮我做这件事吗？

尝试使用

toggleClass（）

var=false；
var target=jQuery（.editcheckhour:not（：disabled））；
jQuery（“.checkalledit”）。单击（函数（）{
target.prop（“选中”，点击）。最近（'label'）。toggleClass（'bgcolor'）；
点击=！点击；
});
标签{
背景色：#558；
颜色：白色；
填充物：5px12px；
}
标签>输入：禁用{
不透明度：0.5
}
钮扣{
显示：块；
边缘顶部：20px；
}
.bgcolor{
背景色：#c00；
}

一角
二
三
四
开/关
很简单。添加一个类来标记代码中的默认值，并将该类定义为css文件中的默认颜色

<label><input class="editcheckhour defaultColor"  type="checkbox"> onet</label>
<label><input disabled class="editcheckhour defaultColor"  type="checkbox"> two</label>
<label><input class="editcheckhour defaultColor"  type="checkbox"> three</label>
<label><input class="editcheckhour defaultColor"  type="checkbox"> four</label>

另一种新颜色将是这样的红色

newColor {
     background-color: red;
   }

在按钮上，单击只需删除类并将类添加到按钮状态上的标签。要保持按钮状态，请按以下方式编写代码：

<button type="button" class="checkalledit" data-status="0">on / off</button>

因此，请使用一个类来切换classI很少使用toggleClass（），所以我忘了它。非常感谢。
<button type="button" class="checkalledit" data-status="0">on / off</button>

jQuery(".checkalledit").click(function() {
var status = $(this).attr("data-status");
if(status == 0){
target.prop("checked", !clicked).closest('label').removeClass("defaultColor");
target.prop("checked", !clicked).closest('label').addClass("newColor");
$(this).attr("data-status","1");
  }
  else{
  target.prop("checked", !clicked).closest('label').removeClass("newColor");
   target.prop("checked", !clicked).closest('label').addClass("defaultColor");
$(this).attr("data-status","0");
  }
  });