javascript - onclick が外部 js ファイルでは機能しないが、インラインでは機能しない

Question

私が欲しいもの<h1>：タグ内のテキストでテキストの色を赤に変更します<id="headline">

次のコードが機能しない理由を知っている人はいますが、この質問のさらに下では、そのコードは onclick-event をインライン コードに移動することで機能しますか?

動作しません: 外部の js ファイルに記述された次のコード

function changeColor(){
    document.getElementById("headline").style.color = "red";
}

document.getElementById("headline").onclick = changeColor;

---

Works : 外部の js ファイルに記述された次のコード (機能は同じです):

function changeColor(){
    document.getElementById("headline").style.color = "red";
}

…そしてこれはインラインコードで書かれています:

<h1 id="headline"  onclick="changeColor()">with inline code this text change color on click</h1>