title: jquery trigger('click') works only once
body: <p>I'm trying to customize a jQuery lightbox plugin called <a href="http://sachinchoolur.github.io/lightGallery/" rel="nofollow">LightGallery</a> to achieve the following result:</p>
  
  <p>1- Make the script fetch all images from a folder, using index increment as an image path;</p>
  
  <p>2- Make the Lightbox open after clicking another element.</p>
  
  <p><strong>The problem is:</strong></p>
  
  <p>The plugin opens the lightbox <strong>one time only!</strong>. </p>
  
  <p>I'm using <code>trigger('click')</code> to fires it for the first time, but after closing it and trying to click to repeat it again it does NOT work.</p>
  
  <p>the plugin looks destroyed and it opens one image only!</p>
  
  <p>I want it to opens the lightbox every time I click the targetted elements.</p>
  
  <p>Here's my attempts: ( <a href="http://codepen.io/anon/pen/KzXgOv?editors=0010" rel="nofollow"><strong>Pen here</strong></a> )</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(document).ready(function() {
  
    var $lg = $('#lightgallery');
  
    function fetchFolderImages() {
      var checkImages, endCheckImages;
      var img;
      var imgArray = new Array();
      var i = 1;
  
      var myInterval = setInterval(loadImage, 1);
  
      if ($lg.children().length &gt; 0) {
        checkImages = false;
        endCheckImages = true;
      } else {
        checkImages = true;
        endCheckImages = false;
      }
  
      function loadImage() {
        if (checkImages) {
          checkImages = false;
          img = new Image();
          img.src = 'http://sachinchoolur.github.io/lightGallery/static/img/' + i + '.jpg';
          img.onload = moreImagesExists;
          img.onerror = noImagesExists;
        }
        if (endCheckImages) {
          clearInterval(myInterval);
          console.log('function [loadImage] done');
          runLightGallery();
          return;
        }
      }
  
      function moreImagesExists() {
        imgArray.push(img);
        $lg.append($('&lt;a/&gt;', {
          'href': img.src
        }).html(img));
        i++;
        checkImages = true;
  
        console.log('function [moreImagesExists] done');
      }
  
      function noImagesExists() {
        endCheckImages = true;
  
        console.log('function [noImagesExists] done');
      }
  
      console.log('function [fetchFolderImages] done');
    }
  
    function runLightGallery() {
  
      if ($lg.lightGallery()) {
        //alert('working');
      } else {
        //alert('destroyed');
        $lg.lightGallery({
          thumbnail: true
        });
  
      }
      //trigger click event on image to open the lightbox
      $lg.children('a').trigger('click');
  
      //empty method, thought we may can use
      $lg.on('onAfterOpen.lg', function(event) {
        //maybe we can use this method?
      });
  
      $lg.on('onCloseAfter.lg', function(event) {
        $lg.children().remove();
        $lg.toggle();
        //$lg.lightGallery().destroy(true);
      });
  
      console.log('function [runLightGallery] done');
  
    }
  
    $('.gallery-item').each(function() {
      $(this).on('click', function() {
        $lg.toggle();
        fetchFolderImages();
      });
    });
  
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  
  &lt;head&gt;
    &lt;link type="text/css" rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/lightgallery/1.2.16/css/lightgallery.css" /&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  
    &lt;div class="gallery"&gt;
      &lt;div class="gallery-item"&gt;Gallery Item 1&lt;/div&gt;
      &lt;div class="gallery-item"&gt;Gallery Item 2&lt;/div&gt;
      &lt;div class="gallery-item"&gt;Gallery Item 3&lt;/div&gt;
    &lt;/div&gt;
  
    &lt;div id="lightgallery" style="display: none; border: 5px solid red"&gt;&lt;/div&gt;
  
    &lt;!--============== scripts ==============--&gt;
    &lt;!-- jQuery --&gt;
    &lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.js"&gt;&lt;/script&gt;
    &lt;!-- jQuery mouse wheel --&gt;
    &lt;script src="//cdnjs.cloudflare.com/ajax/libs/jquery-mousewheel/3.1.13/jquery.mousewheel.js"&gt;&lt;/script&gt;
    &lt;!-- lightGallery : a lightbox jQuery plugin --&gt;
    &lt;script src="//cdnjs.cloudflare.com/ajax/libs/lightgallery/1.2.16/js/lightgallery.js"&gt;&lt;/script&gt;
    &lt;!-- lightGallery plugin for thumbnails --&gt;
    &lt;script src="//cdnjs.cloudflare.com/ajax/libs/lightgallery/1.2.16/js/lg-thumbnail.js"&gt;&lt;/script&gt;
  
  &lt;/body&gt;
  
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>