Using a php script for a randomized image

Hello!

I am currently trying to use a random background image inside the ‘site-branding’ container and even though I’m pretty sure that my script itself works, the ‘GetElementbyID” command doesn’t seem to do anything – no matter where I put it. I read somehwere that it should appear after the class that you want to use it with, but even putting the script at the end of the ‘body’ section didn’t make it work. Is there anything that I have to consider with this theme? Is there something preventing it from working?

The script:
<div id=”site-branding”></div>
<script type=”text/javascript”>
var imgCount = 2;
var dir = ‘https://8lackscans.de/wp-content/banner/&#8217;;
var randomCount = Math.round(Math.random() * (imgCount – 1)) + 1;
var images = new Array
images[1] = “Banner01.png”,
images[2] = “Banner02.png”;
document.getElementById(“site-branding”).style.backgroundimage = “url(” + dir + images[randomCount] + “)”;
</script>

(I used an ‘alert’ line after that to make sure that the link is correct and that it’s random every time you reload the page.. and that works as intended.)

I am using a CustomCSS PlugIn that is part of the SiteOrigin Pagebuilder to change up a few things (I COULD use the CustomCSS of the theme but it’s actually less convenient to do so). I have a couple of lines in there that change a few things with the site-branding container, like this:
background-repeat: no-repeat;
background-position: center;
margin-top: 20px;
height: 225px;

I already tried changing the position of the script from header.php to footer.php and I also got rid of the customCSS COMPLETELY.. nothing worked. I can post the complete sourcecode if that’d help.

The page I need help with: [log in to see the link]