Декодировать содержимое HTML клонированного div

Question

Я пытаюсь найти способ декодирования HTML-кода div, клонированного с использованием jQuery.
Исходный div динамически генерируется переменными AngularJS, и я хотел бы отобразить его клонированную версию вэлемент <pre> для отображения DOM, полученного в результате пользовательского ввода.

$(document).ready(function() {
  $('#cloneIt').on('click', function() {
    $('#clone').children().clone().appendTo("pre");
  });
});

Ascolta la sintesi in {{ language.name }} Leggi la sintesi in {{ language.name }}

Сгенерировать исходный код

Нажав кнопку желаемого выхода (после того, как AngularJS выполнил свою работу) должно быть:

<table>   
 <tbody>
    <tr>
      <td class="ico"><img src="assets/images/ico/audio.png"></td>
      <td class="r-text"><a href="assets/audio/Audio-link_01.mp3" target="_blank">Listen to <strong>Italian</strong> track</a></td>
      <td class="ico"><img src="assets/images/ico/pdf.png"></td>
      <td class="r-text"><a href="assets/pdf/Pdf-link_01.pdf" target="_blank">Read <strong>Italian</strong> transcript</a></td>
    </tr>
    [and so on...]
  </tbody>
</table>  

Как можно декодировать содержимое HTML клонированного div?

Я рад, что вы можете помочь мне в этом деле.Спасибо всем.

Answer 1

Чтобы достичь того, что вам нужно, установите html() элемента #clone в качестве text() элемента pre, например:

$(document).ready(function() {
  $('#cloneIt').on('click', function() {
    $("pre").text($('#clone').html());
  });
});

Ascolta la sintesi in {{ language.name }} Leggi la sintesi in {{ language.name }}

Генерация исходного кода