<div id='vvv' style='transition: transform 30s ease-in-out;  width: 100px; height: 100px; background: #0000ff; position: absolute; top:500px; left:200px;'></div>"

 document.querySelector('body').insertAdjacentHTML(`beforeEnd`,p);

document.querySelector('#vvv').style['transform'] = 'translate3d(200px, -200px, 0px)';

  Функция transform: translate3d() задает сдвиг элемента на заданное значение одновременнно по осям X, Y, Z в трехмерном пространстве.

Сдвиг может быть как положительным, так и отрицательным Для оси X: положительное значение сдвигает вправо, отрицательное - влево. Для оси Y: положительное значение сдвигает вниз, отрицательное - вверх.

См. также функции transform: translateZ и transform: translate.

Обратите внимание на то, что при любых трансформациях transform, другие элементы будут вести себя так, будто мы не трансформировали элемент, и он даже может налезть на другие.