I made something similar! https://github.com/andrewbaxter/malarkdowney - The main difference (I think) is that mine applies h* style changes and isn't visually separated from the rest of the page. I.e. it's not just syntax highlighting, it's a more fully-blown output preview.

The text overlay approach doesn't work if you want width-affecting/height style changes (I assume) since that'd cause the overlay to stop matching. The downside is contenteditable cursor movement is broken for inexplicable reasons.