Проблема с работой transition

Прошу помочь в аминировании динамически создаваемых объектов. Объекты создаются, но свойство transition не применяется как нужно. Вернее оно применяется правильно, только если я пользуюсь профайлером — тогда происходит движение, если же без него — то позиция меняется, но без анимации - просто перескакивает.

 .wrp {
   position: absolute;
   width: 500px;
   height: 300px;
   perspective: 500px;
   left: 200px;
 }
 .D {
   position: absolute;
   left: 100px;
   top: 100px;
 }
</style>
<script>
 function Temp() {
   $("<div class='D'>text</div>").appendTo(".wrp");
   $(".D").css({"transition": "all 2s", "transform": "translate(200px, 200px"});
 }
</script>

Идея: создать объект в нужной позиции (100, 100) и плавно его передвинуть в позицию (200, 200).