How do I create a dismissible alert that persists across page reloads?

<!-- BEGIN COPY / PASTE -->
        <div id="myAlert" class="alert alert-warning alert-dismissible fade show" role="alert">
            This is a dismissible alert that persists across reloads.
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>

        <script>
            document.addEventListener('DOMContentLoaded', function() {
                const alertElement = document.getElementById('myAlert');
                const alertDismissed = localStorage.getItem('alertDismissed');

                if (alertDismissed) {
                    alertElement.style.display = 'none';
                }

                alertElement.addEventListener('close.bs.alert', function() {
                    localStorage.setItem('alertDismissed', 'true');
                });
            });
        </script>
        <!-- END COPY / PASTE -->