screen.js

const data = {
    name: '',
    lastName: '',
    country: '',
  };

  const selectScreen = [screen1, screen2, screen3, screen4];

  let screen = 0;

  const wizardDiv = document.querySelector('#wizard');

  const changeScreen = (state) => {
    screen = state;
    wizardDiv.innerHTML = selectScreen[state];

    const nextButton = document.querySelector('#wizard-form input[type="submit"]');
    const backButton = document.querySelector('#wizard-back-button');

    const nameForm = document.querySelector('.form-control[name="firstName"]');
    const lastNameForm = document.querySelector('.form-control[name="lastName"]');
    const countryForm = document.querySelector('#wizard-field-country');

    switch (state) {
      case (1):
        nameForm.setAttribute('value', data['name']);
        lastNameForm.setAttribute('value', data['lastName']);
        break;
      case (2):
        if (data['country'] !== '') {
          const getCountry = document.querySelector(`#wizard-field-country [value="${data['country']}"]`);
          getCountry.setAttribute('selected', '');
        }
        break;
      case (3):
        const tableForm = document.querySelector('.table');
        const nameCell = tableForm.rows[1].cells[1];
        const lastNameCell = tableForm.rows[2].cells[1];
        const countryCell = tableForm.rows[3].cells[1];

        const newName = document.createTextNode(data['name']);
        const newLastName = document.createTextNode(data['lastName']);
        const newCountry = document.createTextNode(data['country']);

        nameCell.append(newName);
        lastNameCell.append(newLastName);
        countryCell.append(newCountry);
        break;
    }

    if (nextButton) {
      nextButton.addEventListener('click', () => {
        if (nameForm) {
          data['name'] = (nameForm.value === data['name']) ? data['name'] : nameForm.value;
        }
        if (lastNameForm) {
          data.lastName = (lastNameForm.value === data['lastName']) ? data['lastName'] : lastNameForm.value;
        }
        if (countryForm) {
          data.country = (!countryForm.value) ? data['country'] : countryForm.value;
        }
        changeScreen(screen + 1);
        });
    }
    if (backButton) {
      backButton.addEventListener('click', () => changeScreen(screen - 1));
    }
  };

  changeScreen(screen);