title: lightgallery.js multiple instances not working
body: <p>I am trying to use <a href="http://sachinchoolur.github.io/lightGallery/docs/api.html" rel="nofollow">"LighGallery.js"</a> in my page.</p>
  
  <p><strong>Situation:</strong> I have several groups of images and each group should be displayed in its own gallery.
  For each group, there is 1 image visible, and the rest are hidden and are to be shown in a gallery when the first visible image is clicked.</p>
  
  <p><strong>Problem:</strong> The gallery triggers for the only the first category. It does not triggers gallery view for the rest of the images.</p>
  
  <p><strong>Question:</strong> How can I use multiple instances of galleries. I can't seem to figure it out from the documentation. Anyone worked on this before?</p>
  
  <p><strong>What I have tried:</strong> I read around and tried using the <em>Hash</em> plugin that comes along. It still did not work:</p>
  
  <p>Code structure:</p>
  
  <p><em>HTML:</em></p>
  
  <pre><code>&lt;div class="topleft"&gt;
    &lt;!--Gallery 1st picture triggers--&gt;
    &lt;ul&gt;
      &lt;li&gt;
        &lt;a class="gthumbnail gallery1" href="http://lorempixel.com/320/240"&gt;&lt;img src="http://lorempixel.com/320/240" alt=""&gt;&lt;/a&gt;
      &lt;/li&gt;
      &lt;li&gt;
        &lt;a class="gthumbnail gallery2" href="http://lorempixel.com/320/240"&gt;&lt;img src="http://lorempixel.com/320/240" alt=""&gt;&lt;/a&gt;
      &lt;/li&gt;
    &lt;/ul&gt;
    &lt;!-------------------&gt;
  
    &lt;!--Individual galleries surrounded by DIVs--&gt;
    &lt;div&gt;
      &lt;a class="gallery1" href="http://lorempixel.com/320/240"&gt;&lt;img src="http://lorempixel.com/320/240" alt=""&gt;&lt;/a&gt;
      &lt;a class="gallery1" href="http://lorempixel.com/320/240"&gt;&lt;img src="http://lorempixel.com/320/240" alt=""&gt;&lt;/a&gt;
    &lt;/div&gt;
  
    &lt;div&gt;
      &lt;a class="gallery2" href="http://lorempixel.com/320/240"&gt;&lt;img src="http://lorempixel.com/320/240" alt=""&gt;&lt;/a&gt;
      &lt;a class="gallery2" href="http://lorempixel.com/320/240"&gt;&lt;img src="http://lorempixel.com/320/240" alt=""&gt;&lt;/a&gt;
    &lt;/div&gt;
    &lt;!-------------------&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><em>JS:</em></p>
  
  <pre><code>$(".topleft").lightGallery({
    thumbnail: true,
    hash: true,
    galleryId: "gallery1",
    selector: '.gallery1'
  });
  
  $(".topleft").lightGallery({
    thumbnail: true,
    hash: true,
    galleryId: "gallery2",
    selector: '.gallery2'
  });
  </code></pre>
  
  <p>Thanks you</p>