when i push the button again the information will be updated not added

Question

How to change my code, when I push the button again the information is adding to previous, I need that when I push the button the information updates.

    document.querySelector(".city-select").onchange = () => {
        let strUser = document.querySelector(".city-select").value;
        updateInfo(strUser);
        //getWeather()// при селекті

    }
   
   function updateInfo(strUser) {
   fetch(`http://api.openweathermap.org/data/2.5/weather?q=${strUser}&appid=f3ab273b1163fcf008d6d3ce02f9e86e`)
       .then(function (resp) { return resp.json() })
       .then(function (data) {
           console.log(data);
           document.querySelector('.package-name').textContent = data.name;
           document.querySelector('.price').innerHTML = Math.round(data.main.temp - 273) + '°';
           document.querySelector('.disclaimer').textContent = data.weather[0]['description'];
           //https://openweathermap.org/img/wn/[email protected]
           document.querySelector('.features li').innerHTML = `<img src="https://openweathermap.org/img/wn/${data.weather[0]['icon']}@2x.png">`;
           document.querySelector('.button-primary').onclick = () => {
               let div = document.createElement('div');
               div.innerHTML = 'Wind speed: ' + data.wind.speed + ' km/h' + '<br>'+'Humidity: '+data.main.humidity + '%' + '<br>'+ 'Pressure: ' + data.main.pressure + 'Pa';
               document.querySelector('.out').appendChild(div);
           }
       })
       .catch(function () {
           // catch any errors
       });
   }

Answer 1

This is because you used appendChild (https://www.w3schools.com/jsref/met_node_appendchild.asp)

Maybe you should try this instead (if there is already an element) : How to replace DOM element in place using Javascript?