There is no way around it, you have to escape the values properly, or the HTML can’t be parsed properly. You can’t use Javascript to correct the code after it is parsed, because then it has already failed.
Your example with proper HTML encoding would be:
<p class="example" data-example="She said "<abbr title="What The F***">WTF</abbr>" on last night's show.">
You can’t use backslash to escape characters, because it’s not Javascript code. You use HTML entities to escape characters in HTML code.
If you can’t control how the data is input, then you are screwed. You simply have to find a way to take control over it.