I am a newbie in JS and trying to learn how API works. I was trying to fetch a randomuser API data but I'm getting this error "Uncaught (in promise) TypeError: Cannot read properties of undefined"

Here's my code:

const url = 'https://randomuser.me/api/';
const btn = document.getElementById('button');
const output = document.getElementById('output');
btn.addEventListener('click', getData);

function getData(){
        output.innerHTML = "";
        fetch(url).then(function(response){
            return response.json()
        }).then(function (data) {
            console.log(data.results);
            const val= data.results;
                let div = document.createElement('div');
                div.textContent = `${val.name.title} ${val.name.first} ${val.name.last}`;
                let ima = document.createElement('img');
                ima.setAttribute('src', data.results.picture.thumbnail);
                ima.style.display = 'block';
                div.appendChild(ima);
                output.appendChild(div);
          });
    }