CIS 119 An image link rollover which also controls another image

Code

"use strict";
let ctr = 0;
let strPics = "musicCat:computerCat:phoneCat:attackCat:pets";
let picNames = strPics.split(":");
let picSmall = new Array();
let picLarge = new Array();
for (ctr=0; ctr<picNames.length; ctr++) {
    picSmall[ctr] = new Image();
    picLarge[ctr] = new Image();
    picSmall[ctr].src = '../images/th_' + picNames[ctr] + '.jpg';
    picLarge[ctr].src = '../images/' + picNames[ctr] + '.jpg';
}

window.onload = function() {
    ctr = Math.floor(Math.random()*picNames.length);
    let link = document.getElementById('link');
    let img1 = document.getElementById('r1');
    let img2 = document.getElementById('r2');
    img1.src = picSmall[ctr].src;
    img2.src = picLarge[ctr].src;
    
    link.onmouseover = function() {
        ctr++;
        if (ctr >= picSmall.length) ctr = 0;
        img1.src = picSmall[ctr].src;
        img2.src = picLarge[ctr].src;
    }
};