i am trying to refresh an {%extends%} page since my base.html is getting message information from whatever is happening in the python backend, it only shows the message after i refresh my page and i want to refresh it every x seconds so the alerts will show without needing to refresh my entire page.

    <div id="Mydiv">
{% extends 'crodlUSDT/base.html'%}
</div>
<script>
$(document).ready(function()
    {
        function refresh()
        {
            var div = $('#Mydiv'),
                divHtml = div.html();

            div.html(divHtml);
        }

        setInterval(function()
        {
            refresh()
        }, 3000); //300000 is 5minutes in ms
    })
</script>

this is what i've found online but tested a lot of different things but none are working, is this possible ? thanks

ive also tried doing this inside of my html file

    <div id="messages" class="messages">
    {% if messages %}
    {% for message in messages %}
    <div class = "alert alert-{{message.tags}}">{{message}}</div>
    {% endfor %}
    {% endif %}
</div>
<script>
    $(document).ready(function()
        {
            function refresh()
            {
                var div = $('#messages'),
                    divHtml = div.html();
    
                div.html(divHtml);
            }
    
            setInterval(function()
            {
                refresh()
            }, 3000); //300000 is 5minutes in ms
        })
    </script>

but also only shows the message after page refresh