How to make the script work when pressed ::before?

How to make the script not work when clicked on .steps li, and clicking on .steps li:before?

<!--- Script clicking on the items listed plus copies the link ID ---->
the <script>let buttons = document.querySelectorAll('.steps li, .i2 h2, .i2 h1');

Array.prototype.forEach.call(buttons, function(el) {
 el.addEventListener("click", function(event) {
 let tmp = document.createElement('INPUT');
 let str = location.protocol + '//' + location.hostname + location.pathname + location.search +'#'+ el.id;
 tmp.value = str; 
 document.body.appendChild(tmp); 
 tmp.select(); 
document.execCommand('copy');
 document.body.removeChild(tmp); 
 }); 
});
</script>
June 10th 19 at 15:15
3 answers
June 10th 19 at 15:17
As, then, they are pseudo-elements, access them from js no.
June 10th 19 at 15:19
There is a hack for css
.steps li { pointer-events: none; }
.steps li:before { pointer-events: all; }

Then the element for the event will not be captured, and its pseudo elements will be.

upd: example for credibility
upd2: What happens in this case? Your event applies to the element and its pseudo-elements. Using pointer-events we disable the triggering of events on the item, and on the pseudo-elements left behind. Thus attain the desired result.
js doesn't know anything about pseudo elements, so no clicks will not work - Elmer.Upt commented on June 10th 19 at 15:22
js knows about the item itself. This is enough to ivent extended to his pseudo-elements. To work directly with them js not, maybe Yes.

Here's an example:
https://jsfiddle.net/fqhk7dea/ - ryann_Stehr commented on June 10th 19 at 15:25
so , I don't mind )))))) - Elmer.Upt commented on June 10th 19 at 15:28
June 10th 19 at 15:21
With the pseudo-element it will not work. Is before inside li span place and it has event.

Find more questions by tags jQueryJavaScript