Loading Javascipt when try to load page content in a div

I’ve been working on a one-page site that dynamically loads data from various pages I created in wp-admin. Here’s the example site. For example, if you click on CONTACT, a div with the id of #panel would slide down and display a Contact Form 7 element. That’s great but if you try filling it out and submitting it, it takes you to a plain screen acknowledging your submission with a new form.

That’s not supposed to happen.

Not to mention the form results never reach me.

I’m experiencing a similar situation with a slider I’m trying to create using FlexSlider. Same problem. Content looks messed up. Try CLIENTS–>Who We Work With and you’ll see what I mean (unless I somehow fixed it).

After playing around with this a lot, I got the feeling that since the code is being loaded well after the Javascript / JQuery has been loaded, that none of the features will work because it’s too late.

In the case of the FlexSlider, and I realize this is bad coding, I tried placing all the JS in the page itself. It worked on it’s own but not using this dynamic loading method.

And CF7? Well, that code is already placed by the plugin itself!

So am I correct in my assumptions that these pages don’t function properly due to JS already having been loaded? If so, how can I make it where it doesn’t load until that onClick call is made?

Here’s the JQuery code I currently have in my footer. Maybe there’s something I can add here or in functions.php or similar. Anyone have any suggestions?

<script type="text/javascript">
    jQuery(function($) {
    $("li.btn-slide a").on('click', function(e){
        e.preventDefault();

        var post_url = $(this).attr("href");
        var post_id  = $(this).attr("rel");

        $("#page-con").html("loading...")
                      .load(post_url, function() { // content loaded callback

            var pageconHeight = $("#page-con").height();  // Find the height of the content inside #panel
             $("#panel").animate({height: pageconHeight}, "slow"); // Animate the height of #panel

        });
    });
});
</script>

<script type="text/javascript">
    jQuery(document).ready(function(){
    jQuery("li.btn-home a").click(function(){
		jQuery("#panel").slideUp( "slow" );
		return false;
    });
});
</script>