Question

I would like to show/hide divs in different url’s. Div’s show/hide based upon URL.

<div class="top">Top</div>
<div class="bottom">Bottom</div>

If http://www.alldiv.com both the divs should be visible else if http://www.bottdiv.com “top div” should hide.

Could anyone please advise?

Answer 1

Using hostname you can do

jQuery

$(function() {
  var host = location.hostname;
  $(".top").toggle(host.indexOf("alldiv")!=-1); // only show on alldiv
});

Plain JS

window.onload=function() {
  var host = location.hostname;
  var topDiv = document.getElementsByClassName("top");
  topDiv.style.display=host.indexOf("alldiv")!=-1)?"block":"none";
}

that said, you really should not even send it to the client if you want to hide it unless you want to possibly show it later