Мне нужно по клику на checkbox выбрать все чекбаксы (тут использовала jqury. Нет с этим поблем) + что бы зеленый квадрат исчезал и появлялся при клике на "Выбрать" либо на сам чекбокс. Вот код.Подскажите в чем проблема.
$(".allTrue").click(function() {
$(".allCheck").prop('checked', this.checked);
})
.labelChose{
position: relative;
}
.allTrue {
display: none;
}
.labelChose:before{
content:"";
width:20px;
height: 20px;
border:1px solid black;
vertical-align: middle;
display: inline-block;
margin-bottom:4px;
}
.labelChose:after{
content:"";
width:10px;
height: 10px;
vertical-align: middle;
background: #5cb85c;
display: inline-block;
position: absolute;
left:5px;
top:8px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="d-flex justify-content-center mb-4" >
<h5><label class="labelChose mt-2"> <input type="checkbox" class = "mr-2 allTrue"/>Выбрать</label></h5>
</div>
<ul>
<li>
<input type="checkbox" class="allCheck">
<span class="ml-3">ABank</span>
</li>
<li>
<input type="checkbox" class="allCheck">
<span class="ml-3">ABank</span>
</li>
<li>
<input type="checkbox" class="allCheck">
<span class="ml-3">ABank</span>
</li>
</ul>