Simple toast notification

Easy:

<button onclick="toast('foo')">Show Toast</button>

<script>
function toast(message) {
  var snackbar = document.createElement("div");
  snackbar.id = "snackbar";
  snackbar.innerText = message;
  document.body.appendChild(snackbar);

  snackbar.style.cssText = `
    visibility: visible;
    text-align: center;
    border: 2px solid black;
    padding: 16px;
    position: fixed;
    z-index: 1;
    left: 50%;
    bottom: 30px;
    transform: translateX(-50%);
    opacity: 1;
  `;

  setTimeout(function() {
    snackbar.style.visibility = "hidden";
    snackbar.style.opacity = "0";
    document.body.removeChild(snackbar);
  }, 3000);
}
</script>

(source)