Show div based on if statement
<p>I'm trying to use this code to hide or show a div based on the url param "direction" I can't get this to work and wonder if there is a better way. Sample url = <a href="http://domain.com?direction=south&amp;season=summer" rel="nofollow">http://domain.com?direction=south&amp;season=summer</a>  - Thanks</p>

<pre><code>&lt;head&gt;
&lt;script type="text/javascript"&gt;

        function getUrlVars()
        {
            var vars = [], hash;
            var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&amp;');
            for(var i = 0; i &lt; hashes.length; i++)
            {
                hash = hashes[i].split('=');
                vars.push(hash[0]);
                vars[hash[0]] = hash[1];
            }
            return vars;
        }

        var myVal = getUrlVars()["direction"];


        if(myVal == "north") {

            document.getElementById('north').style.display = 'block'; 
        }else {

            document.getElementById('south').style.display = 'none'; 

        }
        &lt;/script&gt;
        &lt;/head&gt;

        &lt;body&gt;

        &lt;div id="north"&gt;Some text&lt;/div&gt;

        &lt;div id="south"&gt;Some text&lt;/div&gt;

        &lt;/body&gt;
</code></pre>
