[SOLVED] Replace UTF-8 characters in header id's and anchor links


I am writing a new theme from scratch. I am trying to use menuspy.js library to implement scrollspy functionality. It seems to work only for header anchors which contain only latin characters. On of the solutions that seems to work is to replace non-latin characters with latin under id and href. How can I do it?
For instance, I want this html:

<h1 id="šventasis-vincentas-paulietis">Šventasis Vincentas Paulietis<a href="#šventasis-vincentas-paulietis" class="hanchor" arialabel="Anchor"> 🔗︎</a><h1>

to look like this:

<h1 id="sventasis-vincentas-paulietis">Šventasis Vincentas Paulietis<a href="#sventasis-vincentas-paulietis" class="hanchor" arialabel="Anchor"> 🔗︎</a><h1>

I have tried to use regex with replaceRE function, but unsuccessfully. Maybe there is another option?

EDIT: Workaround is to add heading id’s manually to your markdown source:
# Šventasis {#sventasis}

The way to do the replacement is described here: