I'm trying to add additional page to customer badge if Catering__c checkbox is ticked on Project_Attendance__c object.

Sections I've adddeed:

<style>
@page {
size: 102mm 76mm;
margin: 0mm;
padding: 0mm;
}

#Catering{text-align: center; font-size:14pt; }
</style>

PLUS

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>

                <script type="text/javascript">
                //window.onload = setupPage();

                function setupPage() {
                                
                                var c = new sforce.SObject("Project_Attendance__c");
                                c.id ="{!Project_Attendance__c.id}";
                                c.Catering__c = true;
                                $(".Table1").css("background" , "White");
                                
                                "{!Project_Attendance__c.Catering__c}" = true) 
                                    { 
                                        $("#Catering").css("page-break-after", "always");
                                        var msg="";
                                        if ("{!Project_Attendance__c.Catering__c}" = true) { msg="You are entitled to premium catering. Please collect your voucher from registration desk.";}
                                        $("#Catering").html("<p>" + msg + "</p>");
                                    }
                                
                                
                }
                </script>



                <script type="text/javascript">
                $(document).ready(function() {

                                var originalFontSize = 12;
                                var sectionWidth = $('.divFirstName').width();

                                $('span').each(function(){
                                                var spanWidth = $(this).width();
                                                var newFontSize = (sectionWidth/spanWidth) * originalFontSize;
                                                var newSize = newFontSize/1.2;
                                                if (newFontSize > 50) { newFontSize=50; }
                                                $(this).css({"font-size" : newFontSize, "line-height" : newFontSize/1.2 + "px"});
                                });

                                setupPage();
                });
                </script>

but additional page is not printing at all. Any ideas where is the error?

Thank you in advance