Please tell me how to make a custom list of countries using the API. Here's the fetch code:

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);
});

full code html, css, js The second list, "Country" is formed, but the name of the country is not supplied to the form, and the attribute "data-value="" " should be in the input below. In the first list "Guests Amount" everything is OK, because all code is in the in html from the begining. I need the same dropdown but with countries. Just to say, everything works with the select tag, but I need a custom list. Thanks in advance.