Récupérer les enfants directs d'un body correspondant à une classe donnée

Bonjour,
Je cherche à insérer du code HTML à l'aide de Javascript juste avant le premier élément de type class="Ma classe",
Il faut d'abord que je trouve le noeud.
Jusqu'ici j'avais utilisé le code

Code:

---

var mavar=document.body.getElementsByClasseName("Ma classe");

---

Mais ce code récupère aussi les éléments qui sont les petits enfants du body. Or je ne veux pas les prendre en compte ; je veux seulement prendre en compte les enfants directs.
Ensuite, je veux prendre le premier. Si j'étais sûr que le premier est bien un enfant direct de body, je ferais

Code:

---

Mavar[0]

---

Mais ce n'est pas toujours le cas
Comment puis-je résoudre ce problème c'est à dire ne dénombrer que les enfants directs ?

Ceci devrait faire l'affaire :

Code:

---

[...body.children].filter(elmt=>elmt.matches('.my-class'))

---

children renvoie la liste des enfants direct et on filtre ceux contenant la classe désirée.

sinon, le selecteur d'enfant direct en CSS >

Code:

---

const tonElement = document.querySelector('body > .taClass')

---

apres, un simple insertBefore fera l'affaire ;)