Form select validation with javascript

Hi,

I have a form, where i use javascript to parse the form, put it in a json object and submit to an API.

For normal text input i can add/remove the "is-valid" or "is-invalid" class to show validation result. But how this work for select dropdown? i cannot find information about this.

                                    <select data-mdb-select-init id="shipping_country">
                                    <option value="" disabled selected>--- Select country ---</option>
                                    <option value="DE">Germany</option>
                                    <option value="BE">Belgium</option>
                                    <option value="NL">Netherlands</option>
                                </select>
                                <label class="form-label select-label">Country</label>

When i use dev tools in browser, this became:

<div id="select-wrapper-shipping_country" class="select-wrapper"><div class="form-outline" data-mdb-input-init="" data-mdb-input-initialized="true"><input class="form-control select-input" type="text" role="listbox" aria-multiselectable="false" aria-disabled="false" aria-haspopup="true" aria-expanded="false" readonly="true" data-np-autofill-field-type="country"><label class="form-label select-label active" style="margin-left: 0px;">Country</label><span class="select-arrow"></span><div class="form-notch"><div class="form-notch-leading" style="width: 9px;"></div><div class="form-notch-middle" style="width: 52.8px;"></div><div class="form-notch-trailing"></div></div><div class="form-label select-fake-value active">--- Select country ---</div></div><select data-mdb-select-init="" id="shipping_country" class="select-initialized" data-mdb-select-initialized="true" data-np-autofill-field-type="country" data-mdb-validation="false">
                                    <option value="" disabled="" selected="">--- Select country ---</option>
                                    <option value="DE">Germany</option>
                                    <option value="BE">Belgium</option>
                                    <option value="NL">Netherlands</option>
                                </select></div>

When i manually set the "is-invalid" class to the "select-wrapper-..." / div / input element, then it show correctly, but how to do this in javascript?