Just adjust your list with the type attribute;

document.querySelector("ol").type = "I";
const items = document.querySelectorAll('#players li');
console.log(items[0], items[1], items[2]);

<section id="players">
  <h1>Players</h1>
  <ol>
    <li>Alice</li>
    <li>Bob</li>
    <li>Cesar</li>
  </ol>
</section>

You can just querySelect the parent ‘ol’ and then change it’s list style in Javascript using element.style.listStyleType = “upper-roman”. This should apply the style its child elements.

you can change type attribute of the ol tag reference

const items = document.querySelectorAll('#players li');
document.querySelector("ol").type = "i";
console.log(items[0], items[1], items[2]);

<section id="players">
  <h1>Players</h1>
  <ol>
    <li>Alice</li>
    <li>Bob</li>
    <li>Cesar</li>
  </ol>
</section>

I have:

const items = document.querySelectorAll('#players li');
console.log(items[0], items[1], items[2]);

<section id="players">
  <h1>Players</h1>
  <ol>
    <li>Alice</li>
    <li>Bob</li>
    <li>Cesar</li>
  </ol>
</section>

Producing:

Players
    1.Alice
    2.Bob
    3.Cesar

Now I want convert the integers to Roman numerals, using javascript, externally in my javascript file, instead of setting the numerals in the HTML-file, like this:

<ol type="i">
  <li>First</li>
  <li>Second</li>
  <li>Third</li>
</ol> 

This is my Javascript code so far, but I want to to convert the numbers to numerals:

const items = document.querySelectorAll('#players li');
console.log(items[0], items[1], items[2]);