data-target not triggering modal

So I'm trying to use one of the pre-defined modal templates available, however the data-target tag doesn't seem to be working for me. I copied and pasted the code just to get an example working for myself. The code is below...perhaps this is something that isn't available in the free version?

<!-- Button trigger modal-->
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#modalConfirmDelete">Launch modal</button>

<!--Modal: modalConfirmDelete-->
<div class="modal fade" id="modalConfirmDelete" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
 <div class="modal-dialog modal-sm modal-notify modal-danger" role="document">
 <!--Content-->
 <div class="modal-content text-center">
 <!--Header-->
 <div class="modal-header d-flex justify-content-center">
 <p class="heading">Are you sure?</p>
 </div>

<!--Body-->
 <div class="modal-body">

<i class="fa fa-times fa-4x animated rotateIn"></i>

</div>

<!--Footer-->
 <div class="modal-footer flex-center">
 <a href="https://mdbootstrap.com/product/material-design-for-bootstrap-pro/" class="btn btn-outline-danger">Yes</a>
 <a type="button" class="btn btn-danger waves-effect" data-dismiss="modal">No</a>
 </div>
 </div>
 <!--/.Content-->
 </div>
 </div>
 <!--Modal: modalConfirmDelete-->