Задача при клике на разные блоки с классом "media" копировать их содержимое в блок c классом "tt", чтоб они появлялись один под другим.
Сейчас это не работает, т.к. на какой бы блок ("media") не нажимал, все копируется с первого.
//выбираем нужные элементы
var a = document.querySelectorAll('.media');
//перебираем все найденные элементы и вешаем на них события
[].forEach.call( a, function(el) {
//вешаем событие
el.onclick = function(e) {
//производим действия
$('#clicker').clone(true).unwrap().appendTo('.tt');
}
});
<div class="media" id="clicker">
<div class="media-body">
<h3 class="mb-0">54,120</h3>
<span class="text-uppercase font-size-xs">total</span>
</div>
</div>
<div class="media" id="clicker">
<div class="media-body">
<h3 class="mb-0">12,650</h3>
<span class="text-uppercase font-size-xs">total</span>
</div>
</div>
<div class="media" id="clicker">
<div class="media-body">
<h3 class="mb-0">32,390</h3>
<span class="text-uppercase font-size-xs">total</span>
</div>
</div>
<div class="media" id="clicker">
<div class="media-body">
<h3 class="mb-0">76,770</h3>
<span class="text-uppercase font-size-xs">total</span>
</div>
</div>
<div class="tt">
</div>