How to make use of it:

1. Import the minified version of the Iconic Dropdown library into the doc.

<script src="dist/dropdown.min.js"></script>

2. Initialize the Iconic Dropdown on the present choose aspect and executed.

<select id="country">
  <option value="AF">Afghanistan</option>
  <option value="AX">Åland Islands</option>
  <option value="AL">Albania</option>
  <option value="DZ">Algeria</option>
  ... more options ...
</select>

var dropdown = new IconicDropdown({
    select: "#country"
});
dropdown.init();

3. You can even define the information in an array of JS objects as follows:

var dropdown = new IconicDropdown({
    select: "#country",
    data: [
      { valueName: "GB", itemName: 'UK'}, 
      { valueName: "VU", itemName: 'Vanuatu'}, 
      { valueName: "YE", itemName: 'Yemen'}
    ],
    textField: 'itemName',
    valueField: 'valueName',
});

4. Customize the placeholder text.

var dropdown = new IconicDropdown({
    select: "#country",
    placeholder: "Select A Country"
});

5. Customize the text of the suggestion.

var dropdown = new IconicDropdown({
    select: "#country",
    noData: "No data.",
    noResults: "No results found.",
});

Minimal Select Box Replacement, Iconic Dropdown Plugin/Github, ul li dropdown select, convert select option to ul li jquery, responsive select dropdown css

See Demo And Download