Collapsible Code Output for `xaringan`

collapseoutput.js

<script>
  (function() {
    var divHTML = document.querySelectorAll(".details-open");
    divHTML.forEach(function (el) {
      var preNodes = el.getElementsByTagName("pre");
      var outputNode = preNodes[1];
      outputNode.outerHTML = "<details open class='output'><summary>Run</summary>" + outputNode.outerHTML + "</details>";
    })
  })();
(function() {
  var divHTML = document.querySelectorAll(".details");
  divHTML.forEach(function (el) {
    var preNodes = el.getElementsByTagName("pre");
    var outputNode = preNodes[1];
    outputNode.outerHTML = "<details class='output'><summary>Run</summary>" + outputNode.outerHTML + "</details>";
  })
})();
</script>

slide.Rmd

---
output:
  xaringan::moon_reader:
    includes:
      after_body: "collapseoutput.js"
---

### "Run" code in your slides!
.details[
```{r}
summary(cars)
```
]