Jquery Select2 display dynamic options

JavaScript
1

Hi,
I am working on a select dropdown that has products. Products that get displayed are based on the category that a user selects. My products get updated correctly but i cannot view them. What appears is a white background and a user cannot know what they are selecting. The appear like this :slight_smile:

Screenshot (12)
Screenshot (12)1920×1080 249 KB

Any tips on what i can do to make the options visible will be appreciated?

My code

 $(response.order_product.product.category.products).each(function (index, _product) {

                        product.append($('<option>').val(_product.uuid).text(
                            _product.generic_name + ' ' +
                            (_product.brand_name != null ? _product.brand_name : '')));

                    });

My select input is

<div class="form-group">
                        <label for="product" class="control-label">Select Product</label>
                        <select class="form-control search-enabled" id="product">
                        </select>
                        <span class="help-block">The product</span>
                    </div>