Jquery function in firefox returns object object

I am creating a popup where the user needs to accept terms before being able to tick a checkbox. I have everything working except in firefox it returns a blank page with [object, object]. This works as expected in chrome.

    <script>

    $(document).ready(function(){  

        //jquery for select / other question
        $(function () {
            $("select#ddlPractice").change();
        });
        $('#ddlPractice').on('change',function(){
            if( $(this).val()==='0'){
                $('#otherPractice').show();
            }
            else{
                $('#otherPractice').hide();
            }
        });

        //jquery for terms (1)
        $('#chkTerms1').on('change',function(){
            if($(this).is(":checked")){
                //open pop up
                $.magnificPopup.open({
                    type: 'inline',
                    closeOnBgClick: false,
                    items: {
                        src: '#ex1'
                    },
                    modal: true,

                });
                //they set to agreed using accept / close buttons under popup content
                $('#chkTerms1').prop('checked', false);

            }
            else if($(this).is(":not(:checked)")){
                //nothing
            }
        });





    });

</script>

The buttons to close the popup and check the boxes:

                <a href="javascript:$('#chkTerms2').prop('checked', true);" class="legalButtonsPop legalButtonsAccept">Accept</a>

<a href="javascript:$('#chkTerms2').prop('checked', false);" class="legalButtonsPop legalButtonsClose">Close</a>

Any help would be much appreciated.

Many thanks!