<ul>
  <li id="foo">foo</li>
  <li id="bar" class="selected">bar</li>
  <li id="baz" class="selected">baz</li>
</ul>

{
  const ex1 = $('#bar').index()
  const ex2 = $('li.selected').index($('#bar'))
  
  console.log(ex1)
  console.log(ex2)
}

{
  const ex1 = Array.from(document.querySelector('#bar').parentElement.children).indexOf(document.querySelector('#bar'))
  const ex2 = Array.from(document.querySelectorAll('li.selected')).indexOf(document.querySelector('#bar'))
  
  console.log(ex1)
  console.log(ex2)
}