toggle element on page load with a hash link not working
<p>I am new to javascript and using jQuery toggle effect on a button to open and close the following div. Here is my html:</p>

<pre><code>&lt;article id="book-section"&gt;
&lt;h3&gt;The new collection&lt;/h3&gt;
&lt;a class="btn" href="#book-list-one"&gt;Book list&lt;/a&gt;
&lt;div&gt;
&lt;ul&gt;
   &lt;li&gt;Book one&lt;/li&gt;
   &lt;li&gt;Book two&lt;/li&gt;
   &lt;li&gt;Book three&lt;/li&gt;
   &lt;li&gt;Book four&lt;/li&gt;
&lt;/ul&gt;
&lt;/div&gt;
&lt;/article&gt;
</code></pre>

<p>Here is my javascript</p>

<pre><code>$(document).ready(function() {
$(".btn").click(toggle);
function toggle() {
    {
        $(this).toggleClass("open").next().slideToggle();
        return false;
    };

    $("a[href='" + window.location.hash + "']").parent(".btn").click();
}
});
</code></pre>

<p>It's supposed to be opening the div containing the book list when the user types in index.html#book-list-one but it doesn't. The toggle effect works just fine. I can't figure out what the issue is. Any help would be appreciated!!!
Thanks in advance!</p>

<p>Update: Here is the <a href="https://jsfiddle.net/6uxfb71s/" rel="nofollow">JSfiddle</a></p>