What is the best way to hide a div that contains a nested label with a class of label.nbo-disabled-wrap using javascript? I am trying to hide all the divs with the class nbd-xlabel-wrap that have a nested label with the class nbo-disabled-wrap.
This is the script I used:
function hideLabels() {
const labels = document.querySelectorAll('.nbo-disabled-wrap');
labels.forEach(label => {
let currentElement = label;
for (let i = 0; i < 5; i++) {
if (currentElement.parentElement) {
currentElement = currentElement.parentElement;
} else {
break; // Reached the top of the DOM tree
}
}
const targetDiv = currentElement.querySelector('.nbd-xlabel-wrap');
if (targetDiv) {
targetDiv.style.display = 'none';
}
});
}
hideLabels();<div class="nbd-xlabel-wrap">
<div class="nbd-xlabel-value">
<div class="nbd-xlabel-value-inner" title="Titanium">
<input ng-change="check_valid();updateMapOptions('f1539147544370')" value="1" ng-model="nbd_fields['f1539147544370'].value" name="nbd-field[f1539147544370]" type="radio" id="nbd-field-f1539147544370-1" class="ng-pristine ng-untouched ng-valid ng-not-empty">
<label class="nbd-xlabel ng-isolate-scope nbo-disabled-wrap" for="nbd-field-f1539147544370-1" nbo-disabled="!status_fields['f1539147544370'][1].enable" nbo-disabled-type="class"></label>
</div>
</div>
<label for="nbd-field-f1539147544370-1"><b>Titanium</b></label>
</div>