<script>
async function fetchServiceStatus() {
    const response = await fetch('https://manage.office.com/api/v1.0/f9667c14-0222-4eb2-a91b-a306434f23e1/ServiceComms/CurrentStatus', {
        method: 'GET',
        headers: {
            'Authorization': 'Bearer {access_token}',
            'Accept': 'application/json'
        }
    });
    const data = await response.json();
    displayServiceStatus(data);
}

function displayServiceStatus(data) {
    const statusContainer = document.getElementById('service-status');
    data.value.forEach(service => {
        const serviceElement = document.createElement('div');
        serviceElement.innerHTML = `<h3>${service.Workload}</h3><p>${service.Status}</p>`;
        statusContainer.appendChild(serviceElement);
    });
}

fetchServiceStatus();
</script>
<div id="service-status"></div>