Emergency Weather App Failure - Receiving emergency evacuation alert but not showing it

We're making an advanced weather app that displays emergency alerts. It uses the weather.com API and Supabase Realtime to receive emergency notifications. After finishing part of the frontend, we tested it, but it didn't work. Logs shown that the message was sent and received by the publishable key on the frontend, but no alert was displayed.

We've double-checked the callback mechanism and used console.log, which verifies the function was executed. Still, it doesn't display the alert.

Here's the callback:

const chatChannel = supabase.channel(location) chatChannel .on('broadcast', { event: 'emergency' }, (payload) => { app.displayPush({ type: 'emergency', message: payload.message, locations: payload.locations, source: payload.source, id: payload.id }) }) .subscribe()

And here's the minimal displayPush:

async function displayPush(info){ if (info.type=='emergency'){ let alert = document.createElement('div') .class = 'relative isolate flex items-center overflow-hidden bg-red-900 text-neutral-50' .height = '500px' .id = 'emergency-alert-'+info.id .innerHTML = '<p style="font-size: 20px;">'+info.message+'</p><br><p style="font-size: 10px;">'+info.locations+'</p><br><p style="font-size: 5px;">'+payload.source+'</p>' } }