помощник: "клон" не работает

Question

Я хочу увидеть движение клона коробки, но, похоже, это не так. С другой стороны, если я вставлю абзац внутри <div>, содержимое абзаца будет правильно клонировано. Первоначально я хотел переместить и <div> (то есть красное поле) и <p>. Мой селектор jquery неправильный?

$(function() {
  $("#div1").draggable({
    helper: "clone"
  });
});

#div1 {
  width: 100px;
  height: 100px;
  border: solid 2px black;
  background: red;
}

<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/ui-lightness/jquery-ui.css">
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>

<div id="div1">
</div>