如何在jquery中将optgroup设置为复选框

我有下面的代码，它显示了使用optgroup的组的复选框列表。现在我的问题是，我如何确保即使是组名也有复选框，以便一次可以选择一个组？？请在底部找到屏幕截图

   <select title="Fruits" multiple="multiple" data-native-menu="false" id="fruits" name="fruits[]">
<option selected="selected" label="All" value="">All</option>
<optgroup label="Fruits" class="fruit" value="">
    <option label="apple" value="1">Apple</option>
    <option label="pear" value="2">Pear</option>
    <option label="orange" value="3">Orange</option>
</optgroup>
<optgroup label="Berrys" class="berries" value="">
    <option label="strawberry" value="4">Strawberry</option>
    <option label="raspberry" value="5">Raspberry</option>
    <option label="blueberry" value="6">Blueberry</option>
</optgroup>
   </select>

全部的
苹果
梨
橙色
草莓
覆盆子
蓝莓

---

您忘记发布您尝试的jQuery。我不确定我是否理解。到目前为止，我还没有使用任何jquery，只是希望有组的复选框，这样我就可以一次选择整个组。我可以使用jquery代码为组启用复选框吗？您可以在每个组中添加另一个“全选”。