IDを付けずにオブジェクトを操作

Question

IDをつけずにオブジェクトを操作する方法を教えていただきたいです
１のコードであればthisで動かせますが２のコードとなると動かせなくなります
２の状態でうまく動かす方法があれば、教えてください

IDがないとDocument.getElementById()を使えない、
クラスもなければ、Document.getElementsByClassName()を使えない
どうやってDOMを動かすか

１
<div>1</div>
<div>2</div>
<div>3</div>

<script>
window.onload=function(){
Array.from(document.querySelectorAll('div'), i => {
i.addEventListener('click', function() {
this.style.color="red";
});
});
}
</script> 

２
<div>1</div>
<div>2</div>
<div>3</div>

<script>
window.onload=function(){
Array.from(document.querySelectorAll('div'), i => {
i.addEventListener('click', function() {
change();
});
});
}
function change(){
this.style.color="red";
}
</script> 

Answer 1

callメソッドを使えばできます。

<div>1</div>
<div>2</div>
<div>3</div>

<script>
window.onload=function(){
  Array.from(document.querySelectorAll('div'), i => {
    i.addEventListener('click', function() {
      change.call(this);
    });
  });
};

function change(){
  this.style.color="red";
}
</script>