unspla sh запрос дает случайное изображение

Question

Я новичок в изучении создания приложений с API и node.js и застрял с проблемой. Пользовательский интерфейс обновляется из ввода city.value, и когда я получаю API, поисковый запрос возвращает случайное значение img, однако, когда я жестко кодирую значение в URL-адресе выборки, изображение корректно.

Помогите, пожалуйста, что мне не хватает / нет видишь?

const city = document.getElementById('city').value;
const messageBody = document.getElementById('content');

    const postImage = new Image();
fetch(`https://api.unsplash.com/search/photos?query=${city}&client_id=${client_id}`)
    .then(res => res.json())
    .then(
        result => {
            const imgurl = result.results.map(
                hit => hit.urls.regular
            );
            postImage.src = imgurl[0];
            console.log(imgurl[0])
        },
        error => {
            console.log(error);
        }
    );

const updateUI = (items) => {
    let html = items.map((item => {
        return ` 
        <p> 
        ${item.content} 
        <img src='${postImage.src}' width='400'>
        </p>`;
    })).join(" ");
    messageBody.innerHTML = html;
}