How can I display all guessed numbers in this lottery function?

Question

I've created some simple lottery function in JS. All works fine.

The only issue I'm facing is how to display all numbers which have been guessed?

I have 6 independent spaces where numbers must be provided and my goal is to display the rolled number from random space, it must be just provided in one of the 6 spaces. That works for me, but only 1 number displays.

I'm looking for solution how to display all the guessed numbers?

function losowanie1() {
  var wybor = 6;
  var dostepne = 6;
  r = new Array(dostepne)

  var xd0 = document.getElementById("pole1").value
  var xd1 = document.getElementById("pole2").value
  var xd2 = document.getElementById("pole3").value
  var xd3 = document.getElementById("pole4").value
  var xd4 = document.getElementById("pole5").value
  var xd5 = document.getElementById("pole6").value

  y = new Array(6)
  y[0] = xd0
  y[1] = xd1
  y[2] = xd2
  y[3] = xd3
  y[4] = xd4
  y[5] = xd5

  z = new Array(6)

  for (var i = 0; i <= dostepne - 1; i++) {
    r[i] = Math.floor((Math.random() * (49 - 1)) + 1);
    if ((y[i] == r[0]) || (y[i] == r[1]) || (y[i] == r[2]) || (y[i] == r[3]) || (y[i] == r[4])) {
      document.getElementById("zatw").innerHTML = y[i]
    }
  }

  document.getElementById("wysw").innerHTML = r;
}

<div id="wysw"></div>
<div id="dupa">
  <input type="text" id="pole1" /><input type="text" id="pole2" /><input type="text" id="pole3" /><input type="text" id="pole4" /><input type="text" id="pole5" /><input type="text" id="pole6" />
  <br></br>
  <input type="reset" id="tak" value="zatwierdz" onclick="losowanie1();" />
  <br></br>
  <div id="zatw"></div>

Answer 1

What the below still misses is to make sure the user don't repeats numbers in the inputs.
I won't do that since I would neither use inputs for that purpose, but rather predefined checkboxes (yes, 38 checkboxes) and make sure , on submit, exactly 6 are checked.

Anyways, hope this might be helpful:

function lottoGenerate(min, max) {
  // Shuffle: https://stackoverflow.com/a/6274381/383904
  const a = Array.from({length: max}, (_, v) => v + 1);
  for (let i = a.length - 1; i > 0; i--) {
    const j = Math.floor(Math.random() * (i + 1));
    [a[i], a[j]] = [a[j], a[i]];
  }
  return a.slice(0, min);
}

function play() {
  const guessed_nums = [];
  const lotto_nums = lottoGenerate(6, 38); // Generate 6 random unique lotto numbers 
  const player_nums = Array.from(document.querySelectorAll('.num')).map(el => {
    const n = parseInt(el.value, 10);
    const isGuessed = lotto_nums.includes(n);
    if (isGuessed) {
      guessed_nums.push(n); // Insert the guessed number!
      el.style.background = 'lightgreen';
    } else {
      el.style.background = 'red'
    }
    return n
  });

  document.getElementById('gen').textContent = lotto_nums.join(', ');
  document.getElementById('player').textContent = player_nums.join(', ');
  document.getElementById('response').innerHTML = `
    You guessed ${guessed_nums.length} numbers!<br>
    The numbers are: ${guessed_nums.join(', ')}
  `;
}

document.getElementById('play').addEventListener('click', play);

<input class="num" type="number" min=1 max=38 value="1">
<input class="num" type="number" min=1 max=38 value="2"><br>
<input class="num" type="number" min=1 max=38 value="3">
<input class="num" type="number" min=1 max=38 value="4"><br>
<input class="num" type="number" min=1 max=38 value="5">
<input class="num" type="number" min=1 max=38 value="26"><br>
<button id="play">PLAY LOTTO 6/38</button>
<div>Numbers: <span id="gen"></span></div>
<div>User played: <span id="player"></span></div>
<div id="response"></div>