Bootstrap is not loading on iOS, Safari and Firefox after webpage has gone live

I have a wierd situation, where my webpage used to load just fine, before I put it online with hosting and domain. Now the Modal, that's supposed to popup on click, takes so long to load, that it undermines the whole purpose of the page. And so it's a real problem. At this point it seems to load just fine in chrome though.

I have tried several things, for example thoroughly checking my FTP-client, deleting, editing code, re-uploading but at this point, nothing has worked. Can anyone offer some infight as to where I go wrong?

window.onload = function() {
    const span = document.querySelectorAll(".PopUp");
    span.forEach(LIelm => {
        LIelm.addEventListener('click', showHideModal)
    })
};

function showHideModal(e) {
    const projectNode = e.target.parentNode.parentNode;
    if (!projectNode.matches('.Project, .modal-content')) return;
    e.preventDefault();

    if (projectNode.matches('.Project')) {
        document.getElementById(projectNode.dataset.modal).style.display = "block";
    } else {
        projectNode.parentNode.style.display = "";
    }
}

<head>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>

    <link rel="stylesheet" type="text/css" href="stylesheet.css">
    <script src="ModalPopUp.js"></script>
</head>

<body>
    <div class="content">
        <ul style="list-style: none;">
            <li class="Project" data-modal="myModal_1">
                <span id="myBtn_1">
                    Lirma Type
                </span>
                <span id="year">
                    2019
                </span>

                <div class="Describtion">
                    <p>Typedesign</p>

                    <br>

                    <span class="PopUp">Images</id>
                </div>

                <div id="myModal_1" class="modal">
                    <div class="modal-content">
                        <div id="demo" class="carousel slide" data-ride="carousel">

                            <!-- The slideshow -->
                            <div class="carousel-inner">
                                <div class="carousel-item active">    
                                    <img src="Images/Lirma/type.jpg" alt="img" width="100%">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </li>
        </ul>
    </div>
</body>

<script src="ModalHide.js"></script>
<script src="pExpand.js"></script>

twbs / bootstrap

Bootstrap is not loading on iOS, Safari and Firefox after webpage has gone live #30370