如何使用删除图标在输出 div 中显示子类别复选框标签并在取消选中时将其删除，反之亦然

Question

我有一个带有子类别的类别列表。用户只能从一个类别中选择一个子类别。我想在具有删除图标的输出 div 中显示选定的子类别，单击删除时应将其从输出列表中删除，并取消选中相同的子类别.....<div class="category-output">   <ul>   </ul></div><ul class="main-category-check">     <li>          <p>              <label>                  <input type="checkbox" class="filled-in categoryCheck"                                                                name="season2" />                                                            <span>Category 1</span>                 </label>        </p>     <ul class="sub-category-check">            <li>                 <p>                     <label>                                                                    <input type="checkbox" class="filled-in"                                                                        name="season2" />                                                                    <span>Sub Category 1</span>                                                                </label>                                                            </p>                                                        </li>                                                        <li>                                                            <p>                                                                <label>                                                                    <input type="checkbox" class="filled-in"                                                                        name="season2" />                                                                    <span>Sub Category 2</span>                                                                </label>                                                            </p>                                                        </li>