Я хочу вызвать элементы массива с DOM в JS

Question

У меня есть два HTML файла и один JS файл, поэтому я отправляю информацию на первых HTML страницах в массив в JS, и я хочу получить этот массив во втором HTML файле. поэтому я хочу создать элемент внутри элемента на второй странице, но когда я выбираю один из элементов на второй странице HTML, и он дает мне эту ошибку

(Uncaught TypeError: Cannot set property 'innerHTML' of 
null HTMLAnchorElement.<anonymous>)

Это мой код, но у меня есть ссылка в моем массиве и (pic1 & pic2 & pic3 & pic4) я не поместил ссылки на изображения в этом вопросе

const infoBTN = document.getElementsByClassName('infoBTN');
const images = document.querySelector('#img');

const arr = [{name: 'Hello' , Work: 'Front End Developer' , date : '3/2/2020'} , {name: 'HI' , Work: 'Back End Developer' , date : '3/2/2020'} , {name: 'Jack' , Work: 'Full Stack Developer' , date : '3/2/2020'}];
for (let i = 0; i < infoBTN.length; i++) {
  infoBTN[i].addEventListener('click', () => {
    images.innerHTML = `
    <img src=${arr.pic1} alt="${arr.name}" class="pic1">
    <img src=${arr.pic2} alt="${arr.name}" class="pic2">
    <img src=${arr.pic3} alt="${arr.name}" class="pic3">
    <img src=${arr.pic4} alt="${arr.name}" class="pic4">
   `
  })
}

HTML КОД

<div class="images" id="img"></div>

Пожалуйста, помогите мне

Answer 1

используйте ajax для отправки массива туда и обратно, поместите массив в json