Cloning more than one image javascript

Question

I'm trying to use this glitch effect in a slideshow, so it can work I have to clone the source image 3 more times. The first image works just fine, it's when I try to add the second image of the slideshow that the problem comes up. Instead of cloning que second image itself, the first image kind of reads that like one of it's clone.

Here's a fiddle of what I got so far https://jsfiddle.net/oqbf6kkc/

I think the main problem is the javascript but I can't really understand.

$(document).ready(function(){
    $(".glitch-image img").clone().appendTo(".glitch-image").end()
})

Answer 1

Trailing commas are always a problem.

Please remove the comma present in front of nth-child selector

.glitch-image img:nth-child(2),  {

Also, I am not sure about the effect you mentioned but there is some problem with your JS code as well. You are not iterating over all of the elements.

    $(document).ready(function(){
  $(".glitch-image img").clone().appendTo(".glitch-image").end()
})

I made some changes to your code. Check them here.