How to change the text color in a Materializecss select dropdown?

Question

I have a Materializecss dropdown select like this:

      <form class="col s12">
        <select id="something" [ngModel]="_model.selectedPartyType"
            (ngModelChange)="onSelectChange($event)" name="partyTypeSelection"
            materialize="material_select" class="input-field col s12 m12 l4"
            >
           <optgroup *ngFor="let data of _model.codeTable.codeTokensG" [label]="data[0]">
             <option *ngFor="let cValue of data[1]" [value]="cValue">
               {{_model.codeTable.getCode(cValue).description}}
        </   option>
           </optgroup>
       </select>
      </form>

how do I change the default teal color for the option text? I have tried adding

.dropdown-content li>span {
  color: #000 !important;
}

.dropdown-content li>a {
  color: #000 !important;
}

.select-content li>span {
  color: #000 !important;
}

.select-content li>a {
  color: #000 !important;
}

to my css file, but no luck with this and variants. If I deselect the color attribute in Chrome Developer Tools for the

.dropdown-content li>span

is does as I wish.

How can I change the color?

Answer 1

I had the same problem today. Here's how I solved it:

ul.dropdown-content.select-dropdown li span {
    color: #000; /* no need for !important :) */
}