Remove multiple classes with prefix
HTML
<p>Remember to inspect element on the input below</p>
<div class="custom-nf">
<div class="input nf-input-outer nf-validation">
<div class="nf-container">
<div class="nf-outer nf-outer-input nf-outer-validation">
<div class="nf-middle">
<div class="nf-inner">
<label for="dummy" class="nf-label"></label>
<input id="dummy" type="text" class="nf-input">
</div>
</div>
</div>
</div>
</div>
</div>
JavaScript
var nfClasses = document.querySelectorAll('.custom-nf [class*="nf-"]');
Array.prototype.forEach.call(nfClasses, function(element) {
var classListCopy = Array.prototype.slice.call(element.classList);
classListCopy.forEach(function(className) {
if (className.match(/^nf\-/)) {
element.classList.remove(className);
}
});
});