Troubleshooting jQuery toggle
<p>I am trying to figure it out what I am doing wrong here. WP site, jQuery being loaded on the header, my custom jquery (main.js) is being loaded on the footer.  </p>

<p>JQUERY:</p>

<pre><code>  jQuery(document).ready(function() {

        jQuery("#hc-register-toggle").click(function(){
        jQuery("#event-reg-form-group").toggle();
      });

    });
</code></pre>

<p>HMTL:</p>

<pre><code>&lt;a class="hc-float-left hc-main-button" id="hc-register-toggle"&gt;REGISTER NOW&lt;/a&gt;

&lt;div id="event-reg-form-groups"&gt;

    ..

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

<p>Trying to toggle the form when the button "REGISTER NOW" is clicked.</p>

<p>Any help would be appreciate. Thank you!</p>