title: Image gallery in rails with jQuery
body: <p>I am trying to make a very simple website for myself - I will have a lot of albums with photos of home interiors. I want to implement image gallery for every album. Thing that I can not solve is getting the right image when I click on it. When I do console.log I can see that correct image is selected but it never comes to view. Maybe someone can help me here?
  This is my code:</p>
  
  <pre><code> Album show page:
  
  
  
  &lt;h4 class="text-center" id= "album-title"&gt;
   &lt;%= @album.title %&gt;
  &lt;/h4&gt;
  &lt;div class="text-center album-body"&gt;
   &lt;%= @album.body %&gt;
  &lt;/div&gt;
  
  
  &lt;!-- app/views/posts/show.html.erb --&gt;
   &lt;% if @album.images.attached? %&gt;
  &lt;div class="card-columns"&gt;
      &lt;% @album.images.each do |image| %&gt;
          &lt;%= image_tag image.variant(resize: "250x250"), class: "card album-image gallery-item" %&gt;
          &lt;%= link_to "Remove", delete_image_attachment_album_url(image), method: :delete, data: {confirm: "Are you sure?"} if current_admin %&gt;
  &lt;% end %&gt;
  &lt;% end %&gt;
  &lt;/div&gt;  
  
  &lt;div class = "lightbox"&gt;
   &lt;div class = "lightbox-content"&gt;
      &lt;div class = "lightbox-controls"&gt;
          &lt;a href="#" class="lightbox-close"&gt;Close&lt;/a&gt;
          &lt;a href="#" class="lightbox-prev"&gt; &lt; &lt;/a&gt;
          &lt;a href="#" class="lightbox-next"&gt; &gt; &lt;/a&gt;
      &lt;/div&gt;
   &lt;div class = "lightbox-image"&gt;&lt;/div&gt;
     &lt;/div&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p>And this is my jquery code that I wrote so far..</p>
  
  <pre><code> $(document).on('turbolinks:load', function() {
      $(".lightbox").hide();
  });
  
  $(document).on('turbolinks:load', function() {
  $(".lightbox-close").click(function(event){
      event.preventDefault();
  $(".lightbox").hide();
   });
  });
  
  for(i = 0; i &lt; $(".gallery-item").length; i++) { 
  let item = $(".gallery-item")[i];
  item.onclick = function(event) {
  $(".lightbox").show();
  let elementClickedOn = event.target;
  console.log(elementClickedOn)
   }
  }
  </code></pre>
  
  <p>What do I need to write to get this elementClickedOn to appear in a lightbox?</p>