const placeIcon = (instrument) => {
  if (currStaveNumber > numStaves) currStaveNumber = 1;
  // Select the staveWrapper in which to place the div
  const staveWrapper = document.getElementById(
    `stave-wrapper-${currStaveNumber}`
  );
  // Determine the position of the time indicator
  const rect = timeIndicator.getBoundingClientRect();
  const sheetLeft = sheetWindow.getBoundingClientRect().left;
  const xPosition = rect.left + window.scrollX - sheetLeft;

  // Create the icon div and give it its location data
  const newObject = document.createElement("div");
  newObject.classList.add("event-icon");
  newObject.style.position = "absolute";

  newObject.style.left = `${
    xPosition - document.documentElement.clientWidth / 200
  }px`;
  newObject.style.top = `${instrument.yPos}`;

  // Create the icon
  const eventIcon = document.createElement("object");
  eventIcon.type = "image/svg+xml";
  eventIcon.data = instrument.image;

  // Append icon to div
  newObject.appendChild(eventIcon);

  // Append the div to the staveWrapper
  staveWrapper.appendChild(newObject);
};