insert <script> tag inside .html function

Question

I want to insert the following code inside .html function of code stated in no. 2. But I having an error ,problem that I am facing is that whenever I am adding a it inside .html function the outer script tag in which the $(document).ready() function resides is not working,it is saying that there is no starting tag found for

1) Code to be inserted in .html function.

<script>
    <c:forEach items="#{notificationBean.growlNotificationList}" var="p" varStatus="loop">
                            <script>
                    /*           */
                    $.gritter
                            .add({
                                // (string | mandatory) the heading of the notification
                                title : 'Notification for your #{p.objectType}',
                                // (string | mandatory) the text inside the notification
                                text : '#{notificationBean.notificationSenderName(p.senderEmail)} commented on your #{p.objectType}',
                                // (bool | optional) if you want it to fade out on its own or just sit there
                                sticky : true,
                                // (int | optional) the time you want it to be alive for before fading out (milliseconds)
                                time : 8000,
                                // (string | optional) the class name you want to apply directly to the notification for custom styling
                                class_name : 'gritter-light',
                                // (function | optional) function called before it closes
                                before_close : function(e, manual_close) {
                                    document.getElementById("foo#{loop.count}:bar").click();
                                }
                            });
                    /*     */
                </script>

                <h:form id="foo#{loop.count}" style="display:none">
                    <h:commandLink id="bar"
                        action="#{notificationBean.set0ToGrowlToShow(p.notificationID)}">
                        <f:ajax />
                    </h:commandLink>
                </h:form>
            </c:forEach>
</script>

2) where the code to be inserted

<script>

    $(document).ready(function(){
          setTimeout( function(){
            $("<div>")
              .html( "" )
              .attr({ id : 'notification', ... })
              .appendTo( "body" /* or any other DOM element */ );
          }, 60*1000);
        })

    </script>

Answer 1

You can Use following Method of jQuery to load Script Dynamically

<script type="text/javascript">
    jQuery(document).ready(function(){
        var url = "https://raw.github.com/jquery/jquery-color/master/jquery.color.js";
        jQuery.getScript(url);
    });