If we have this HTML,

<ol class="parent-list">
  <li>item 1</li>
  <li>item 2</li>
  <li>item 3</li>
  <ol class="sub-list">
    <li>item 1</li>
    <li>item 2</li>
    <li>item 3</li>
  </ol>
</ol>

Is it ok to use ‘&’ inside querySelector() or querySelectorAll() to get immediate children of an element like this

const parentList = document.querySelector('ol.parent-list');
const immediateChildren = parentList.querySelectorAll('&>li');

The above code is working properly and if we try to remove ‘&’ to get the immediate children list, it gives an error.

const parentList = document.querySelector('ol.parent-list');
const immediateChildren = parentList.querySelectorAll('>li'); // returns error

Is there any other recommended way for this or is this ok to use?