Given an element, how to detect which "n" it is in an "nth of type"?

Question

I know how to select the nth element of a certain type document.querySelectorAll('.myClass')[n],

but given an element myEl = document.querySelector('.myClass .myOtherClass'),

how do I then determine its place (its "n") in the array of elements selected by document.querySelectorAll('.myClass')?

`document.querySelectorAll('.myClass').indexOf(document.querySelector('.myClass .myOtherClass'))` — Scott Marcus, Jun 08 '22 at 17:56
Or are you specifically asking about [`:nth-of-type`](https://developer.mozilla.org/en-US/docs/Web/CSS/:nth-of-type)? — Bergi, Jun 08 '22 at 17:58

score 1 · Answer 1 · answered Jun 08 '22 at 17:57

1

do this:

document.querySelectorAll(".myClass").indexOf(yourElement) // ==> your index

answered Jun 08 '22 at 17:57

lolBOT V9.17

score 1 · Answer 2 · answered Jun 08 '22 at 17:59

1

U can try something like that:

Array.prototype.indexOf.call(document.querySelectorAll('.myclass'),myEl)

answered Jun 08 '22 at 17:59

2 Answers2