See my added class in console but not in the DOM-CodePudding

Here is some simple code :

document.querySelectorAll('span[tabindex="-1"]').forEach(freeDay => {
    freeDay.classList.add('text-base-100');
    console.log(freeDay.className);    
});

I try to add the class text-base-100

By using console.log() I display the class of my freeDay element, which I can find in the

Check your selector and/or HTML markup!

CodePudding user response：

The mdn web docs says that The Element.classList is a read-only property that returns a live DOMTokenList collection of the class attributes of the element.

Since it's read-only, the only other alternative that I can think of is to directly modify freeday.className, which is the same string that appears in the attribute in the HTML.

source:

https://developer.mozilla.org/en-US/docs/Web/API/Element/classList
https://developer.mozilla.org/en-US/docs/Web/API/Element/className