Кастомный выпадающий список стран при помощи API

[KatiaBeing]

Подскажите пожалуйста, как правильно сделать кастомный список стран используя API.

Вот fetch код:

 

const countryList = document.querySelector('.form-list.country');

fetch('https://restcountries.com/v3.1/all').then(res => {
  return res.json();
}).then(data => {
  let output = '';
  data.forEach(country => {
    output += `<li class="form-item" data-value="${country.name.common}">${country.name.common}</li>`;
    countryList.innerHTML = output;
  });
}).catch(err => {
  console.log(err);
});

полный код html, css, js Во втором списке "Country" список формируется, но название страны не поставляется в форму, а атрибут "data-value="" " в инпут ниже. В первом списке "Guests Amount" все ок, т.к. данные прописаны в html. Нужен такой же, но со странами.

Сразу скажу, с тегом select все работает, но мне нужна стилизованная выпадашка. Заранее спасибо.