Executing JavaScript on a single page

Question

I have created a js pop up overlay.. I'm trying to get it to display/execute on the homepage of the site only below is the code I have so far:

var overlay = "<div id='overlay'><div id='my_popup'><button id='popupbutton'>Click</button></div>    </div>";
document.body.insertAdjacentHTML('beforeend', overlay);

var button = document.getElementById('popupbutton');

button.onclick = function() {
var div = document.getElementById('overlay');
if (div.style.display !== 'none') {
    div.style.display = 'none';
}
else {
    div.style.display = 'block';
}
};

I've looked into:

if (window.location.href.split('/').pop() == "myURL")

but I can't get my head around getting it to work.

Any suggestions?

Answer 1

You should be able to distinguish homepage using location.pathname property:

if (location.pathname === '/') {
    // homepage
}

In your example if you are on page brooksbarn.com then location.pathname will be /.