I have a plugin which generates dynamically a list of categories.
I want to remove the input type checkbox select only from "Country" with jQuery. I have already tried with remove selector (on class .cat-item-15
) but couldn't manage to make it work. Only for the specific li
which is "Country". This way it removes all.
Is it possible to be applied only on "Country" li
?
I tried this way :
$(".cat-item-15 :checkbox").remove();
And here is the code I need to alter :
<li class="cat-item cat-item-15">
<label><input type="checkbox" name="ofait-items[]" value="15"> Country</label>
<ul class="children">
<li class="cat-item cat-item-53">
<label><input type="checkbox" name="ofait-items[]" value="53"> Canada</label>
</li>
<li class="cat-item cat-item-47">
<label><input type="checkbox" name="ofait-items[]" value="47"> United Kingdom</label>
</li>
<li class="cat-item cat-item-52">
<label><input type="checkbox" name="ofait-items[]" value="52"> USA</label>
</li>
</ul>
</li>
You should be able to use
$(".cat-item-15 :checkbox").first().remove();
or
$(".cat-item-15 :checkbox[value='15']").remove();
When you tried $(".cat-item-15 :checkbox").remove();
it failed because it selects all checkboxes that are descendants of any element with the class of cat-item-15
, which was obviously too many.
:checkbox[value='15']
only selects checkboxes that have a value attribute of 15, and .first()
just selects the first checkbox, so given your code either should work.