JSFiddle - React, Tailwind, and code Playground

HTML

<div class="moveDiv"></div>
	<div class="moveDivB"></div>

CSS

.moveDiv {
		position:absolute;
		left:20px;
		top:20px;
		width:10px;
		height:10px;
		background-color:#444;
	  }
	  
	  .moveDivB {
		position:absolute;
		left:20px;
		top:20px;
		width:10px;
		height:10px;
		background-color:#888;
	  }

JavaScript

function move_div_step(xx,yy,target) // takes one pixel step toward target
	{
		// using a line algorithm to move a div one step toward a given coordinate.
		var div_target = $(target);

		// get current x and current y
		var x = div_target.position().left; // offset is relative to document; position() is relative to parent;
		var y = div_target.position().top;

		// if x and y are = to xx and yy (destination), then div has arrived at it's destination.
		if(x == xx && y == yy)
			return false;

		// find the distances travelled
		var dx = xx - x;
		var dy = yy - y;

		// preventing time travel
		if(dx < 0)			dx *= -1;
		if(dy < 0)			dy *= -1;

		// determine speed of pixel travel...
		var sx=1, sy=1;
		
		if(dx > dy)			sy = dy/dx;
		else if(dy > dx)	sx = dx/dy;

		// find our one...
		if(sx == sy) // both are one..
		{
			if(x <= xx) // are we going forwards?
			{
				x++; y++;
			}
			else  // .. we are going backwards.
			{
				x--; y--;
			}       
		}
		else if(sx > sy) // x is the 1
		{
			if(x <= xx) // are we going forwards..?
				x++;
			else  // or backwards?
				x--;

			y += sy;
		}
		else if(sy > sx) // y is the 1 (eg: for every 1 pixel step in the y dir, we take 0.xxx step in the x
		{
			if(y <= yy) // going forwards?
				y++;
			else  // .. or backwards?
				y--;

			x += sx;
		}

		// move the div
		div_target.css("left", x);
		div_target.css("top",  y);

		return true;
	}  // END :: function move_div_step(xx,yy,target)


	// first animation (fire right away)
	var myVar = setInterval(function(){
		$(function() { // jquery document.ready

			// returns true if it just took a step
			// returns false if the div has arrived
			if( !move_div_step(55,25,'.moveDiv') )
			{
				// arrived...
				console.log('arrived'); 
				clearInterval(myVar);
			}

		});
	},50); // set speed here in ms for your delay
	  

	// pause and then fire an animation..
	setTimeout(function(){
		var myVarB = setInterval(function(){
			$(function() { // jquery...