Is it possible to do this?

By adding a pseudo element you are in absolutely no danger of breaking anything. It does not affect the dom structure. Worst case scenario is that it doesn’t display.

I don’t know what you mean by revisit things?

But worst case scenario - my mobile menu structure, where the divs and thus selectors can change for different arrangements (and may do) only requires a media query to handle the revised pseudo.

If you do it by DOM manipulation via JS then you immediately introduce the over head of a listener on the window resize, which you then need to debounce. You will also likely need a lot more code to detect exactly when the DOM has changed as the chances are you will have no knowledge of the breakpoint set in the theme.

I suppose, the real point here is though, what is the most elegant and code efficient way to do it. If it can be proved to me that it can be done in less JS that one line i.e.
$('#menu').data('num-items','2');
plus the above CSS then I will concede.