Custom Script not working on interior pages.

Custom Script not working on interior pages.

Ok, I am having some issues with a piece of custom code I am trying to use with jQuery Mobile.

I am running jQuery verions 1.8.2 and jQuery Mobile version 1.2.0.

I am trying to get the menu to drop down when the button is clicked and hide when it is clicked again(Code Below).

On the first page, or on a hard refresh the script will work correctly, but, once I navigate to one of the pages from the menu I can no longer get the menu to appear. However, with the console.logs I added in I can see that the script is still running, it just isn't making the menu appear.

I am at a loss of how else to troubleshoot the issue and would really appreciate some help! If you need me to clarify something or if I forgot a piece of information please let me know.

Thanks!

Here is a bit of my code

  1. <div data-role="page">

        <div data-role="header" data-theme="e">

            <a href="#" data-theme="custom-header-button" data-corners="false" data-shadow="false" data-iconshadow="false" class="menu-button">Menu</a>

        </div><!-- data-role="header" -->

        <div data-role="content" data-theme="e">   
            <div id="custom-menu">
                <ul data-role="listview" data-theme="f" data-inset="false">
                    <li><a href="/mobile/index.php">Home</a></li>
                    <li><a href="/mobile/services.php">Services</a></li>
                    <li><a href="/mobile/about.php">About</a></li>
                    <li><a href="/mobile/gallery.php">Gallery</a></li>
                    <li><a href="/mobile/contact.php">Contact</a></li>
                </ul>
            </div>
        <script>
                $('a.menu-button').click(function(){
                    console.log('Click');
                    if ( $('#custom-menu').is(':hidden') ){
                        $('#custom-menu').show();
                        console.log('Show' + $('#custom-menu') );
                    } else {
                        $('#custom-menu').hide();
                        console.log('Hide');
                    }
                });  //Click function
            </script>

    </div><!-- /content -->
    </div><!-- data-role="page" -->