Limit the element within the array to appear X times

Functionality:

A display container will display a randomised element from an array. Each element within the array can only be displayed x no. of times.

Issue:

I am not sure on how to limit each individual element within the array to be displayed x no. of times.

I have randomised all elements within the array, hence at this point in time, the elements in the array will be displayed whenever it is randomised and not limited.

Each of my element within an array is a file name.

Therefore, how am I able to limit the number of times each element in the array is displayed

For example:

lib/image/Voucher/Andn.png => can only be displayed 3 times

lib/image/Voucher/Brelk.png => can only be displayed once

lib/image/Voucher/Cele.png => can only be displayed 6 times

lib/image/Voucher/Chrm.png => can only be displayed 13 times

Code:

var DisplayOfferArray = ["lib/image/Voucher/Andn.png", "lib/image/Voucher/Brelk.png", "lib/image/Voucher/Cele.png", "lib/image/Voucher/Chrm.png"];


var printOfferFrame = "";
var Offer_list = [];
var random_Offer;


//randomise Offer Array
random_Offer = Math.floor(Math.random() * DisplayOfferArray.length);
Offer_list.push(random_Offer);


//Display randomised Offer from offer array
$("#Offer_Description").attr('src', DisplayOfferArray[random_Offer]).show();

<img id="Offer_Description" style="position:absolute; width: 950px; height:565px; top:640px; left:70px; z-index=99; margin:auto;">