Как вывести в консоль координаты движущегося через translate объекта?

Добрый день, есть объект:

<div class="rect"></div>
<style>
.rect {
	display: block;
	width: 100px;
	height: 100px;
	background-color: red;
	transition: transform 2s ease-out;
}
</style>

При клике на объект, менятся его положение на экране:

$(function () {
	$('.rect').on('click', function() {
		$('.rect').css('transform','translate(300px,300px)');
		console.log($('.rect').offset());
	});
});

Если вот так вывести информацию в консоль, то выводятся только начальные координаты объекта. Как вывести все координаты во время движения?