Como defino uma galeria de conteúdo inline em HTML para uso com o Magnific-Popup?

Eu tenho muitas galerias em uma página que são lançadas de seus respectivos botões. Eu gosto da idéia de definir a marcação para as galerias na página ao lado do botão e, em seguida, esconder usando o.mfp-hide. No entanto, não consigo ativar o pop-up quando eu adiciono odelegate palavra-chave (faz o contrário).

Aqui está o código que tenho até agora,

HTML

<div id="gallery1" class="mfp-hide">
  <div class="slide">
    ... some content for slide 1 ...
  </div>
  <div class="slide">
    ... some content for slide 2 ...
  </div>
</div>

<p>Blah blah <a href="#gallery1" class="open-gallery-link">view gallery one</a> blah blah ...</p>

Javascript

$('.open-gallery-link').magnificPopup({
  type:'inline',
  delegate:'.slide',
  gallery: {
    enabled: true
  }
});

questionAnswers(1)

yourAnswerToTheQuestion