The replaceWith() function as documented here does not work in IE: https://developer.mozilla.org/en-US/docs/Web/API/ChildNode/r... You may be able to find hacky alternatives, but if you use jQuery you don't have to.

element.replaceWith(replacement) is just an alias for element.parentNode.replaceChild(element, replacement) with some bonus functionality to convert strings to DOM text nodes. parentNode.replaceChild is not exactly a 'hacky' alternative.

Here it is in the form of a basic polyfill that only supports Elements:

    Element.prototype.replaceWith = function(replacement) {
        if (typeof replacement === "string") {
            replacement = this.ownerDocument.createTextNode(replacement);
        }
        this.parentNode.replaceChild(this, replacement);
    }

Is that just as readable? Is the intent just as clear? Is the improved readability of the jQuery version worth the extra 80kb download to you?

EDIT: Regarding the polyfill, now you are beginning to write your own little jQuery clone.

GitHub says they are using polyfills instead of jQuery as well. The point is to not have to rely on external frameworks.

> The point is to not have to rely on external frameworks.

Why is that a worthwhile goal?

To reduce attack surface as well as maintenance burden for compatibility whenever something breaks during an upgrade.

A polyfill is something that's not needed at all in modern browsers and thus can be considered pretty much final. jQuery is actually surprisingly stable compared to Angular/React/npm/rest-of-the-hipster-crap, but it has had its fair share of incompatibilities too.

Is a set of polyfills philosophically different than a framework?