My request for data from server using the XMLHttpRequest, keeps returning undefined

Question

I tried to request data from this server address https://codexpression.github.io/catz/catz.json using AJAX XMLHttpRequest, but when I tried to console.log the property value of the text, I keep getting "undefined", please find code below:

function getData() {
  let requestObject = new XMLHttpRequest();            //create XMLHttpRequest Object

  requestObject.onreadystatechange = function() {      //create an onstatechange function
    if (this.readyState == 4 && this.status == 200) {  //check if request is successful
      // myFunction(this)
      let convert = JSON.parse(this.responseText)
      console.log(convert.all.text)
    }
  };

  requestObject.open("GET", "https://codexpression.github.io/catz/catz.json", true); //get the document address and send request
  requestObject.send()
}

getData()

Answer 1

console.log(convert.all) works, however, it returns an array,

You will have to loop through the array to get individual elements and then be able to access the .text, or you target a specific index in the array to get the specific .text

for example

const allCats = convert.all

to access all texts , loop through all cats

for(let i = 0; i= allCats.length; i++){
const cat = allCats[i]
const getTexts = cat.text
console.log(getTexts)
}

to target a specific text in the list of cats

allCats[index].text