Почему дочерний объект объекта, возвращаемый событием onmouseenter(this), становится нулевым при использовании определенным образом?

Я совершенно сбит с толку. В первом примере JavaScript e.firsElementChild всегда имеет значение null. Однако во втором примере javaScript e.firstElementChild всегда возвращает текст. Кроме того, если я возьму переменную text и присвою ей значение e.innerText, как показано в примере 3 JavaScript, то e.firstElementChild снова станет нулевым.

html:

<span onmouseenter='onMouseEnter(this)'>
        <span>Child</span>
</span>

JavaScript пример 1:

function onMouseEnter(e){
     e.innerText = e.firstElementChild.innerText;
}

пример JavaScript 2:

function onMouseEnter(e){
    var text = e.firstElementChild.innerText;
    console.info(text);
}

пример JavaScript 3:

function onMouseEnter(e){
    var text = e.firstElementChild.innerText;
    e.innerText = text;
}