Добавить к объекту, выбранному из списка в jQuery

Вот минимальная версия моей проблемы, учитывая:

<div class="foo">
   <div class="a"> </div>
   <div class="b"> </div>
   <div class="c"> </div>
</div>

Я хочу вставить элемент <div class="bar">WORKS!</div> в один из детей случайным образом.

var kids = $(.foo).children();
var idx  = Math.floor(Math.random() * kids.length);
var target = kids[idx];

Я думаю, что это неправильное понимание того, как javascript и jQuery работают вместе. Я изучаю оба на данный момент, так вот моя должная старательность в решении проблемы:

• target.append(...) терпит неудачу, поскольку цель не является объектом JQuery, а .append() является вызовом JQuery.
• $(target).append(...) делает странные вещи, копируя элементы в DOM, и я не понимаю, почему. Он может работать в этом изолированном примере, но это создает сумасшедший город с множеством foo, a, b и c's.
• target.innerHTML=..., похоже, не работает, и я не хочу удалять предыдущий контент с помощью append.