I have added a draggable card dynamically using jquery. However, it is not draggable. How do I make it work?

var newCard = '<div id="draggable-snap-5" class="draggable-snap card">'
      +'<div class="handle ui-draggable"></div>'
      +'<h5 class="card-header primary-color white-text" contenteditable="true" onclick="$(this).focus();">TRAVIS meets P. O.</h5>'
      +'<div class="card-body" >'
      +'<p class="card-text changeable" contenteditable="true" onclick="$(this).focus();">TRAVIS meets a the Personnel Officer. Character is introduced.</p>'
      +'</div>';

  function addNewCard() {
    $(newCard).hide().appendTo("#mycol-2").show(100);
    return false;
  };