Hi Jack,
When the content of your HTML file is injected in the experiment, its first div element is not the first div in the document, unlike when you open the file separately in your browser
You could instead mark the elements whose lines you want to number (in particular, the div element you target) by giving it a specific class (eg. numberTheLines):
<script type="text/javascript">
window.addEventListener("load", ()=>{
var toNumber = document.querySelectorAll('.numberTheLines');
console.log("toNumber", toNumber);
toNumber.forEach( el => {
var lines = el.innerText.split('\n');
console.log("lines", lines);
el.innerText = '';
for (var l = 0; l < lines.length; l++) {
var line = lines[l];
if (line.length == 0) {
continue;
}
var span = document.createElement('span');
next = (l < lines.length - 1) ? lines[l+1] : '';
if (next.length > 0) {
span.className = 'line';
} else {
span.className = 'line end-of-paragraph';
}
span.innerText = line;
el.appendChild(span);
el.appendChild(document.createTextNode('\n'));
}
});
})
</script>
Jeremy