JSFiddle - React, Tailwind, and code Playground

HTML

<div contenteditable="true"><p>These "dumb quotes" are transformed correctly, on blur(), but the ones below only close:</p>
<p>"dumb quotes"</p></div>

CSS

[contenteditable="true"] {
    font-size: 20px;
    border:solid 1px;
}

JavaScript

$(document).ready(function() {
    $('div').focus();
});

$('div').blur(function() {
    text = replace($(this).html());
    $(this).html(text);
});

// replaces straight quotes to curly and double hyphens to em-dashes
function replace(a) {
  a = a.replace(/(^|[-\u2014\s(\["])'/g, "$1\u2018");       // opening singles
  a = a.replace(/'/g, "\u2019");                            // closing singles & apostrophes
  a = a.replace(/(^|[-\u2014/\[(\u2018\s])"/g, "$1\u201c"); // opening doubles
  a = a.replace(/"/g, "\u201d");                            // closing doubles
  a = a.replace(/--/g, "\u2014");                           // em-dashes
  return a
};