I am attempting to access a specific element of an object from an API endpoint () - in this case, the "name" from the "currencies" property. However, each time I try to do so, it returns undefined.
I have experimented with both currencies.name and currencies["name"], but neither seems to be effective.
const countries = document.getElementById('countries');
var request = new XMLHttpRequest();
request.open('GET', 'https://restcountries.eu/rest/v2/all', true);
data.forEach(name => {
const h1 = document.createElement('h1');
h1.textContent = name.capital; //this function works properly
const h2 = document.createElement('h2');
h2.textContent = name.currencies.name; //the issue lies here
countries.appendChild(h1);
countries.appendChild(h2);
});
The desired outcome is to retrieve something like "Afghan afghani", rather than encountering the previous undefined result.