<script> tag won't load with $().load method

I'm trying to re-load the page partially by using $().load method, but when it comes to reload the scripts, it won't reload.

the scripts changes the css; it should change the style of the fragments that I intended, but it isn't working as i intended. I'm curious if there is any way to reload the scripts, so i could re-apply the css even if i reload the page partially.

<div id="scripts">
        <script th:inline="javascript">
            /*<![CDATA[*/
            alert("scripts called");
            function display(table_number) {
                var col = document.getElementById("table" + table_number);
                col.style.backgroundColor = "lightblue";
                col.style.fontWeight = "bold";
            }
            function display_inverse(point_number) {
                var col2 = document.getElementById("Wpoint" + point_number);
                col2.style.opacity = "0.3";
            }
            display(/*[[${whichPlatform}]]*/);
            for (var a = 1; a <= 10; a++) {
                if (a == /*[[${whichXpos}]]*/) {
                    display_inverse(a);
                    break;
                }
            }
        /*]]>*/
        </script>
    </div>
    <script th:inline="javascript">
        setInterval(function () {
            $('#bannerWrap').load(window.location.href + ' #bannerWrap');
            $('#tablewrap').load(window.location.href + ' #tablewrap');
            $('#scripts').load(window.location.href + ' #scripts');
        }, 2000);
        /*]]>*/
    </script>

this is my code. I'm using thymeleaf.