Show Bootstrap 5 model using javascript

Model Code

<div class="modal fade" id="alert_message_modal" tabindex="-1" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        <div class="alert alert-danger d-flex align-items-center" role="alert">
          <div class="alert_message">
              hello world
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

Javascript Code

<script>
var modal = document.getElementById("alert_message_modal"); //html element
modal_ins = new bootstrap.Modal(modal); //convert html element to js object
modal_ins.show();


////////////////////////HIDE
var modal = document.getElementById("payment_model");
var modal_ins = bootstrap.Modal.getInstance(modal); //because bs already create instance
if (!modal_ins) {
    modal_ins = new bootstrap.Modal(modal);
}
modal_ins.hide();  // Hide the modal
</script>