I have one issue, I dont understand why this src.match is considered invalid

PUG (HTML)

 .mainSplitContainer.mainRectangleContainerReverse
    .splitContainer.column8
      .responsiveTextTitle.highlightText.rectangleContainer
          | RESPONSIVE ECONOMY
          .responsiveText.responsiveText
            |With its flux econonomy system, get an economy that responds to your actions instantly and requires you to adapt to the changes in the battlefield!
    .splitContainer.column4
      .splitItem.rectangleItem 

          //what actually matters from the html
        .splitImage#rectangleEconomy
          img(src='../img/resources.jpg' alt='')


Javascript

  let ecoPicture = document.getElementById("rectangleEconomy");
  setInterval(changeImage, 10000);
  function changeImage() {

    if (ecoPicture.src.match("resources")) {
      console.log("yesyesyes");
    }
    else {
      console.log("nonono");
    }
  }

Don't know why it returns this error

Uncaught TypeError: Cannot read properties of null (reading 'src')

its not null because #rectangleEconomy is defined? How to solve this issue? Yes my script is beneath all the HTML at changeImage (index.js:242:18)