Selecting text behind another element with createEvent

I would suggest to do the easy trick: put the transparent element with the same content as your text on-top of text itself and overlay. Here is the demonstration.

P.S.: From my experience any solution in the form you suggest will be awful. It will suffer from browser incompatibilities, side-effects of surrounding mark-up and styling etc.

I have found two solutions for this problem:

1. "pointer-events" css property. Requires IE 9.0+ though.
2. Seems like guys from ExtJS solved it by event forwarding: demo, source, blog post