Initialize Photoswipe with jQuery

Initialize Photoswipe with jQuery

My galleries have two different formats: one for photosets, and one for stand alone images. 

I am trying to use jquery to initialize the gallery, but when I click on an image, it always opens the first image in the page (except when I click on the third image, which for some reason opens the second image). You can see my code here:  https://codepen.io/anon/pen/mqWBXm <-

Additionally, I would like to get the slideshow to only show the image(s) in each <article> Currently, the slideshow shows all the images on the page.

Any help would be greatly appreciated!