Click to change to a random superlative using JavaScript

superlative.Rmd

---
title: "Click to change to a random superlative"
output: html_document
---

From <https://www.garrickadenbuie.com/blog/countdown-v0.4.0/>.

I'm <span class="superlative">overjoyed</span> to announce that...

```{css}
.superlative {
  border-bottom: 1px dashed;
  cursor: pointer;
}
.superlative:hover {
  color: #fb7e8c;
}
```

```{js}
document.addEventListener("DOMContentLoaded", function () {
  document
    .querySelector(".superlative")
    .addEventListener("click", function (ev) {
      const superlatives = [
        "delighted",
        "charmed",
        "elated",
        "excited",
        "pleased",
        "thrilled",
        "chuffed",
        "tickled pink",
        "overjoyed",
        "ecstatic",
        "stoked",
        "proud",
        "fired up",
      ];
      const el = ev.target;
      const idx = Math.floor(Math.random() * superlatives.length);
      el.innerText = superlatives[idx];
    });
});
```