However, it doesn’t function well at all. I want each individual notification to stay visible for 1 second and then fade out. Currently, if you click the button 5 times in 2 seconds, ALL the notifications fade out after only 1 second.

Also, the notifications should actually be removed once they fade out:I tried remove() but then the notification wouldn’t appear the next time the button is clicked.

Can anyone tell me where I’m going wrong in trying to make this function work the way YouTube’s does?

Apparently, you are missing step #2 and #3.
Your code immediately hides the notification as soon as the notification is fully visible.
Your code only hides the element rather than removing it.
Furthermore, your JQuery can be simplified too.

(You don’t really have to use Promise, but it makes the code cleaner, and async more predictable)

One caveat here is that adding a new notification triggers re-render. So, consecutive clicks result blinking.
You can work this around by text replacement or having more sophisticated notification system.