Jquery is not working on javascript created button

Question

I created a link using javascript and I want for delete confirmation dialog here is the html code

 <div class="cd-popup" role="alert">
    <div class="cd-popup-container">
      <p>Are you sure you want to delete this element?</p>
       <ul class="cd-buttons">
        <li><a href="#0">Yes</a></li>
        <li><a href="#0">No</a></li>
       </ul>
      <a href="#0" class="cd-popup-close img-replace">Close</a>
     </div> <!-- cd-popup-container -->
    </div> <!-- cd-popup -->

Here is my jquery code

jQuery(document).ready(function($){
//open popup
$('.cd-popup-trigger').on('click', function(event){
    event.preventDefault();
    $('.cd-popup').addClass('is-visible');
});

//close popup
$('.cd-popup').on('click', function(event){
    if( $(event.target).is('.cd-popup-close') || $(event.target).is('.cd-popup') ) {
        event.preventDefault();
        $(this).removeClass('is-visible');
    }
});
//close popup when clicking the esc keyboard button
$(document).keyup(function(event){
    if(event.which=='27'){
        $('.cd-popup').removeClass('is-visible');
    }
});
});

When I created a link button is working fine.Now the problem is that when I create a javascript dynamic button is not working anymore...

   btn = document.createElement('a');
        btn.className = "btn btn-danger cd-popup-trigger";
        btn.innerHTML = "Delete";
        btn.href="#";