how to fix this onclick error?? (javascript)

Question

i was following youtube tutorial for deleting messages in chat and i did the same thing as he did and onclick doesnt work for me

const newMessage = ref(database, 'messages/');
        
function deleteMessage(self){
    console.log("test");
}
onChildAdded(newMessage, (data) =>  {
    let string = data.val().message;
    string = string.replaceAll("<", "&lt").replaceAll(">", "&gt");
    let msgDiv = '<message>\n' + data.val().time + " / " + data.val().name + ": " + string + '<delete>' + '<button onclick="deleteMessage(this);">' + '<span class="iconify" data-icon="ant-design:delete-filled"></span>' + 'Usuń' + '</button>' + '</delete>' + '</message>'
    let messages = document.querySelector("messages");
    messages.innerHTML += msgDiv;
})

i got: Uncaught ReferenceError: deleteMessage is not defined at HTMLButtonElement.onclick ((index):1:1)

any solutions?