Question

so Im building a script where it will hide divs based upon which ID is in the url. This is what I have so far:

<script>
$(function(){ 
if (document.location.href.indexOf('#aberdeen') > 0) 
$("#centralia, #chewelah, #everett, #harbour-pointe").hide();

if (document.location.href.indexOf('#centralia') > 0) 
$("#aberdeen, #chewelah, #everett, #harbour-pointe").hide();

if (document.location.href.indexOf('#chewelah') > 0) 
$("#aberdeen, #centralia, #everett, #harbour-pointe").hide();

if (document.location.href.indexOf('#everett') > 0) 
$("#aberdeen, #chewelah, #centralia, #harbour-pointe").hide();

if (document.location.href.indexOf('#harbour-pointe') > 0) 
$("#aberdeen, #chewelah, #everett, #centralia").hide();

if (document.location.href.indexOf('#') < 0)
    $(".directory").show();
});
</script>

However it is still showing all of them even with an id appended in the URL. Any ideas?

Answer 1

That’s called a “hash”, not an “ID”. It’s located in document.location.hash, not document.location.href.

if (document.location.hash === '#aberdeen') {
    $("#centralia, #chewelah, #everett, #harbour-pointe").hide();
}