Alex

TypeError: Cannot read property 'addEventListener' of null

const str = `{
"version": "1",              //version maker,
 /** DATA **/
}`

const obj = eval(`(${str})`)

obj.version // "1"

function incrementX(obj) {
  obj.x += 1
  return obj
}

var a = {x: 0}
var b = incrementX(a)

console.log(b) // {x: 1}
console.log(a) // {x: 1} -- Магия

1. Выбросьте XMLHttpRequest
   
2. Используйте fetch
   

3. Promise.all([fetch(`style.css`), fetch(`xmlData.html`)]).then( ... оба запроса завершены )

   
   

if (window.screen.width < сколько-то) {
  сделать что-то ...
}

1. Не setAttribute("class", "buttonDelete"); а classList.add("buttonDelete");
   
2. Вставлять элемент в документ (tr.appendChild(button2)) нужно в самую последнюю очередь, то есть после изменения содержимого button2.innerHTML = 'Delete');
   
3. У вас проблема в том, что в buttonDelete хранится список всех кнопок которые были на момент вызова querySelector. Это не динамическая величина. Вызвали querySelector, он вернул все кнопки которые были на странице в данный момент. Логично, что новые кнопки в этой выборке отсутствуют. Чтобы решить проблему вам нужно:
   
   1. Вынести всю логику для удаления в отдельную функцию, назовём её removeCallback.
      
   2. Добавлять слушателя событий отдельно для каждой кнопки в момент её создания:

      button2.addEventListener('click', removeCallback)
      tr.appendChild(button2)

      
      
   
   
   

1. Не используйте XMLHttpRequest. Просто. не надо.
   
2. Функция parseDateFromGererator должна что-то возвращать. В вашем случае какие-то данные.
   
3. response.param -- вы ищите поле "param" у ответа. Чтобы использовать переменную нужен такой синтаксис: response[param].
   

element.nextElementSibling.nextElementSibling // Соседний через один