JSFiddle - React, Tailwind, and code Playground

HTML

<input type="button" value="Click Me" onclick="move()" />
<div id="targetElement">
  <div id="position1" style="top: 100px; left: 90px;"></div>
  <div id="position2" style="top: 20px; left: 175px;"></div>
</div>
<input type="button" value="Click Me" onclick="move()" class="centerbutton" />
<input type="button" value="Click Me" onclick="move()" />

CSS

#targetElement {
    height: 2000px;
    width: 300px;
    margin: 50px;
    background: #9cf;
}

#position1 {
    position: absolute;
    width: 75px;
    height: 75px;
    background: #080;
}
#position2 {
    position: relative;
    width: 75px;
    height: 75px;
    background: #800;
}

.centerbutton{
  position:absolute;
  top: 1000px;
}

JavaScript

function move(){
	$( "#position1" ).position({my: "left top", at: "left top", of: "#targetElement"});
  $( "#position2" ).position({my: "right top", at: "right top", of: "#targetElement"});
}