Use magnific popup to display random div

Question

I'm using the magnific popup plugin to show a modal window containing HTML content in a div.

When the user triggers the popup, I would like to randomly show one of a number of divs.

But.. due to my poor javascript skills, I'm unsure how to achieve this with magnific's API. (To be honest I'm not even sure where to begin!).

Does anybody have any advice on how to use the API achieve what I need?

Many thanks again..

---

HTML used as the trigger:

<a href="#popup-1" class="open-popup">No</a>

Example of HTML content (one of which to be displayed randomly):

 <div id="popup-1" class="mfp-hide">
   Content here
 </div>

 <div id="popup-2" class="mfp-hide">
   Content here
 </div>

 <div id="popup-3" class="mfp-hide">
   Content here
 </div>

JQuery used to initialise magnific popup:

$('.open-popup').magnificPopup({
    removalDelay: 300,
    mainClass: 'mfp-fade',
    closeOnContentClick: true,
    closeBtnInside: true
});

I found this code that could help with the random div selection? :

 var divs = $("div.Popup").get().sort(function(){ 
  return Math.round(Math.random())-0.5; //random so we get the right +/- combo
 }).slice(0,4)
  $(divs).appendTo(divs[0].parentNode).show();