If this works when a class is present...
$('.priority').children('.no-priority').addClass('normal');
How would I add a class if the child class .no-priority is missing?
Tried code below which does not work
if (!$('.priority').children('.no-priority')) {
$('.priority').addClass('prioritised');
}
Neither does
$('.priority').not('.no-priority').addClass('prioritised');
You can use :not(), :has()
$(".priority:not(:has(.no-priority))").addClass("normal").normal {
color: green;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="priority">
<div class="does-not-have-no-priority">
does not have .no-priority
</div>
</div>
<div class="priority">
<div class="no-priority">
has .no-priority
</div>
</div>Use
filter
$('.priority').filter(function() {
return $(this).find('.no-priority').length === 0;
}).addClass('normal');If I understand your question, you can do this in vanilla javascript:
var priority = document.querySelectorAll('.priority');
for (var i = 0; i < priority.length; i++) {
if (priority[i].querySelector('.no-priority')) {
priority[i].classList.add('normal');
} else {
priority[i].classList.add('prioritised');
}
}.priority.normal {
color: red;
}
.priority.prioritised {
color: blue;
}<div class="priority">
<div class="no-priority">no priority</div>
</div>
<div class="priority">
<div class="foo">priority</div>
</div>