JSFiddle - React, Tailwind, and code Playground

HTML

<input id="input" type="file"/>

CSS

a {
  display: block;
}

JavaScript

function fileToBuffer(file) {
  return new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.onload = evt => resolve(evt.target.result);
    reader.error = reject;
    reader.readAsArrayBuffer(file);
  })
}

function appendLink(blob, name) {
  name = name.replace(/(?=\.[^.]*$|$)/, '_mod')

  const a = document.createElement('a');
  a.href = URL.createObjectURL(blob);
  a.download = name;
  a.append(name)
  document.body.append(a);
}

input.onchange = async function () {
  const { files: [ file ] } = this;
  if(!file) return;

  const buffer = await fileToBuffer(file);
  const toAppend = new Uint8Array([0xFF, 0x00, 0x90]);

  const { type, name } = file;
  const blob = new Blob([buffer, toAppend], { type });

  appendLink(blob, name)
}