Instead of actually selecting the generated content, you could simulate this with some javascript.
I stumbled over this David Walsh blog,
where he provides code that fetches generated content.
Using that, you can append the generated content to the regular content to simulate selection of the generated content, then you can set the generated content with display:none so that it doesn't appear twice. Like this:
FIDDLE
String.prototype.unquoted = function() {
return this.replace(/(^['"])|(['"]$)/g, '')
}
var element = document.getElementById('div1');
var content = window.getComputedStyle(
element, ':after'
).getPropertyValue('content');
element.innerHTML = element.innerHTML + content.unquoted();
console.log(content.unquoted());
div:after {
content: attr(data-generated);
display: none;
}
<div id="div1" data-generated=" world!">Hello</div>
So why would you ever want to do something like that?
Well, you'd probably never want to do this, but I left a long comment on the question explaining a particular constraint that I once had, where this could have been a solution.
NB: I do realize that this 'solution' doesn't really select the generated content itself, but decided to post this answer in case somebody out there ever needed a workaround.
