Prevent the previous event listener from triggering on a new click

Question

I have a search button that has a click event that runs a function that contains an addEventListerner for a download button. I want the user to be able to click search as many times as they want to find the right data. But each time they click search multiple download event listeners are created for the initial search button and when they finally hit download they download however many times they click search. I would like them to only download the latest search.

I have tried using {once: true} on the search button but I want them to be able to search as many times as they need. I also tried cloning the search button after they click to delete the event listener and then reassign it but that did not work. I also tried removing and then immediatley adding it back but I'm guessing all those did not work because the event for the download click has already been added. I was thinking of moving the download event listener outside of the search button click but I need those values to be sent to the download function from the read data function.

searchBtn.addEventListener('click', getTransactionDetails);

const readData = async(data) => {
  // Headers
  let csvData = [
    ['Vehicle', 'SerialNumber', 'Address', 'Driver',
      'Transaction Date', 'Product Type', 'Quantity', 'Unit Price', 'Amount', 'Currency', 'Source Type', 'Filename'
    ]
  ];

  let transactionIdsAtIndex = ['Headers']; // Created to match the onclick event to the right transaction
  let coordinates = [];
  for (let i = 0; i < data.length; i++) {
    coordinates.push(data[i].location);
  }
  let getMediaFile = () => {
    return new Promise((resolve) => {
      api.call('Get', {
        typeName: 'MediaFile'
      }, resolve);
    }).catch(err => console.log(err))
  }
  const mediaFiles = await getMediaFile();
  api.call('GetAddresses', {
    coordinates: coordinates
  }, async addresses => {
    let count = 0;
    for (let j = 0; j < data.length; j++) {
      const gallons = data[j].volume / 3.785412534257983;
      let fileName = 'No Uploaded Image';
      for (let i = 0; i < mediaFiles.length; i++) {
        if (data[j].id === mediaFiles[i].name.split('.')[0]) {
          fileName = mediaFiles[i].name.split('.')[0];
          count++;
        }
      }
      // Values
      csvData.push(
        [
          data[j].description, // Vehicle
          data[j].serialNumber, // Serial Number of the device
          addresses[j].formattedAddress.replaceAll(',', ' '), // Address
          data[j].driverName, // Driver name from Fuel Transaction
          data[j].dateTime.slice(0, 16), // Formatted Date
          data[j].productType, // Product Type
          gallons.toFixed(3), // Quantity
          (data[j].cost / gallons).toFixed(3), // Unit Price
          data[j].cost.toFixed(3), // Amount 
          data[j].currencyCode, // Currency
          data[j].cardNumber, // Source Type
          fileName, // Receipt File Name
        ]
        .join(',')
      );
      transactionIdsAtIndex.push(data[j].id);
    }
    csvToTable(csvData.join('\n'), transactionIdsAtIndex);
    downloadBtn.addEventListener('click', () => downloadFilesAsZip(data, csvData.join('\n'), count));
  }, err => console.log(err));
}