Live preview using quill and MathJax together

I am trying to use quill and MathJax together in my Nuxt app.
I have a live preview section. But the problem is whenever I am trying to re-render the section the Quill Editor is also getting formatted. As a result, the equation is getting cleared before rendering in preview section.
Here is my reRender function:

function reRender() {
const previewEl= document.querySelector(".preview-area");
 MathJax.typeset();
}

I tried passing the previewEl in the argument. Doing so, nothing is updating.

Here is my quill template-

<div id="editor" class="tex2jax_ignore mathjax-ignore" />
    <div class="tex2jax_ignore mathjax-ignore">
      $$ frac{1}{2} $$ - Content not parsed by Mathjax initially but parsed during update
    </div>
 <div v-html="editorHtml" class="preview-area"></div>

Here is script part:

if (typeof Quill !== "undefined") {
      quill = new Quill("#editor", {
        modules: {
          syntax: true,
          toolbar: "#toolbar-container",
        },
        placeholder: "Compose an epic...",
        theme: "snow",
      });

      
      quill.on("text-change", () => {
        editorHtml.value = quill.root.innerHTML;
        reRender();
        const blocks = document.querySelectorAll("pre code");
        blocks.forEach((block) => {
          hljs.highlightElement(block);
        });
      });
    } else {
      console.error("Quill is not defined");
    }

I have also tried using ignoreClass options, which works fine only when reloading the page. When using the typeset(), it is rendering everything including the ignoreClass.