ChartKick Javascript приложение работает, но клон не работает

Question

Это должно быть просто, но я потратил много времени на это.

Я использую чарткик для рубина.

Я зацикливаюсь на массиве объектов для построения диаграмм относительно каждого объекта.Следующий код haml написан внутри цикла.

%a.article-stats-btn{data:{no:{turbolinks:'false'}}}
  %span.glyphicon-stats.glyphicon.stats-icon 
  View Stats
  .chart
    = line_chart chartInfo

Где chartInfo содержит данные относительно каждой итерации цикла.Это отлично работает, и график показывает.Теперь, когда кто-то нажимает на тег <a>, диаграмма должна быть скопирована и показана внутри модального поля.

  $(".article-stats-btn").click(function(){
    $(this).find('.chart').appendTo('.chart-body'); // this works
    $(this).find('.chart').clone().appendTo('.chart-body'); // this doesn't
  });

appendTo работает, если я использую его без clone(), но это приводит к удалению графика из его исходного положения.Я хочу сохранить график на своем месте и просто скопировать его в модальный тег .chart-body.

И модальный вид выглядит следующим образом.

.modal.fade.modal-fade#mymodal
  .modal-dialog
    .modal-content
      .modal-header
        %b Journal Stats
        %button.close{type:'button', data:{dismiss:'modal'}}
          %span{aria:{hidden:'true'}}
            %i.fa.fa-close
          %span.sr-only Close
        %h4.modal-title
      .modal-body.chart-body
      .modal-footer
        %button.btn.btn-default{type:'button', data:{dismiss:'modal'}} Close

Обновление:

Без клона:

С клоном: