Inside DIV elements there are 3 SPAN, 2 with some CSS CLASS and another WITHOUT CLASS. How to select CSS with selectors that has NO CLASS, I tried span: not (.AAA) but I can not put both classes because it does not work. Since classless SPANs can be in any position within the DIVs I have to select them in some way.
<div>
<span class="AAA">AAA</span>
<span class="BBB">BBB</span>
<span>CCC</span>
</div>
<div>
<span class="AAA">AAA</span>
<span>CCC</span>
<span class="BBB">BBB</span>
</div>
As you said, you can do it with the :not() but, instead of adding the concatenated classes inside you should add more than one.
span:not(.AAA, .BBB)
will not work because the selector expects only one element, not a set of elements, the way to do it would be:
span:not(.AAA):not(.BBB)
The solution of @Rabegi is correct but I put another more general. Using :not() and an attribute selector you can select the span that have no class, no matter what class the others have:
span:not([class]) {
color: red;
}<div>
<span class="AAA">AAA</span>
<span class="BBB">BBB</span>
<span>CCC</span>
<span class="DDD">DDD</span>
</div>
<div>
<span class="AAA">AAA</span>
<span>CCC</span>
<span class="BBB">BBB</span>
<span class="DDD">DDD</span>
</div>