JSFiddle - React, Tailwind, and code Playground

HTML

<h1>Кол-во select'ов: <span id="counter">500</span></h1>

<!-- Include Choices CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/choices.js/public/assets/styles/choices.min.css">
<!-- Include Choices JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/choices.js/public/assets/scripts/choices.min.js"></script>

CSS

/* Стили тут просто так вообще */

*,
:before,
:after {
  box-sizing: border-box;
}

body {
  font-family: sans-serif;
  color: #000;
  max-width: 500px;
  background-color: #ddd;
  counter-reset: select;
}

h1 {
  margin: 1em 0;
  padding-left: 1.45em;
}

.choices {
  padding-left: 3em;
}

.choices::before {
  position: absolute;
  top: 1em;
  left: 0;
  width: 2.5em;
  text-align: right;
  counter-increment: select;
  content: ""counter(select) "";
  margin-right: .5em;
}

.choices__list {
  color: #000;
}

.choices__list--dropdown {
  width: calc(100% - 3em) !important;
}

JavaScript

// Функция
function generateSelects() {

  // Просто так, пофиг
  var str = '<select name="" id="" multiple placeholder="Выбери опцию"><option value="Опция">Опция</option><option value="Опция">Опция</option><option value="Опция">Опция</option><option value="Опция">Опция</option><option value="Опция">Опция</option><option value="Опция">Опция</option></select>';

  // Кол-во select'ов для генерации
  var amount = 500;

  // Генерируем 500 select'ов
  for (var i = 0; i < amount; i++) {
    document.body.insertAdjacentHTML('beforeend', str);
  }

  // Считаем select'ы и выводим счеткик
  counter.innerHTML = document.getElementsByTagName("select").length;

  // Инициализируем плагин
  const elements = Array.from(
    document.querySelectorAll('select'),
    element => new Choices(element, {
      removeItemButton: true
    })
  );
}

// Инициализация функции
generateSelects();