Changing background with Type.js

I am trying to run Type.js on my website, and I need the page background to change depending on what is being typed ("home", "school", etc.). I am new to web development, and I can't figure out why this doesn't work. Type.js works as it should, but nothing happens to the background.

Here's my code:

$(function(){
      $(".search").typed({
        strings: ["home", "school", "work", "travel"],
        typeSpeed: 0, // typing speed
        loop: true, // loop on or off (true or false)
        loopCount: false, // number of loops, false = infinite
        onStringTyped: changeBGImage(self.arrayPos)
      });
});

function changeBGImage(arrayPos) {
  if (arrayPos == 0){
    document.getElementById('page-background').className="bg-home";
  } else if (arrayPos == 1){
    document.getElementById('page-background').className="bg-school";
  } else if (arrayPos == 2){
    document.getElementById('page-background').className="bg-work";
  } else if (arrayPos == 3){
    document.getElementById('page-background').className="bg-travel";
  }
}