I have created an electron app that fetches a JSON value from https://complimentr.com/api. But, when you click the button to set the innerHTML value to the JSON value, it gives the dreaded 'undefined'.

// create a variable called url and set it to the url of the website
var url = "https://evilinsult.com/generate_insult.php?lang=en&type=json";
// create a variable called response and set it to the response of the get request
request(url, function(error, response, body){
  var data = JSON.parse(body);
  console.log(data.compliment);
  const btn = document.getElementById('button-1');

  btn.onclick = () => {
    document.body.innerHTML = data.compliment
  }
});

Is there any reason this isn't working? I am new at JavaScript so this could be an easy fix.