Send data from client to Server on button click

Question

I am creating Web app that syncs youtube video between clients so that everybody watches the same content at the same time.If someone skips 30 seconds then that change is to be reflected to every other client. Similarly for pause and play.

I would like to send data about youtube player state (whether the video is paused or played) and the time to the server whenever a client pauses/plays the video or skips time.

I have implemented buttons for pause and play and a progressbar that works.But i want to send the data to the server on button click.

Here is my code for the buttons:

<div>
  <button id="playVideo" class="btn btn-outline-dark" onclick="playVideo();">
 <img src="https://cdn2.iconfinder.com/data/icons/music-player-black/32/music_player_black-01-512.png" width="20" />
  </button>

  <button id="pauseVideo" class="btn btn-outline-dark" onclick="pauseVideo();">
  <img src="https://cdn4.iconfinder.com/data/icons/ionicons/512/icon-pause-512.png" width="20" />
  </button>

  <div id="progressbar" onclick="moveSquare(event)">
    <div id="line" style="border-style: solid;top: 50%;position: relative;left: 105px;bottom: 20px;width: 535px;"></div>

  <div id="square" style="height: 18px;width: 18px;position: relative;left: 98px;border-width: 2px;border-style: solid;bottom: 32px;"></div>
</div>

function pauseVideo() {
    player.pauseVideo();
    }

function playVideo() {
    player.playVideo();
    }

function moveSquare(event){
    var x = event.offsetX;
    var clickedTime = ((x+3) / 533) * player.getDuration();
    seekTo(clickedTime);
    }

Which functionality can I use to implement that?

PS: I am a newbie on stack overflow so please don't mind if my question is poorly framed.