Javascript slideshow doesn't work

Question

So I tried to make a slideshow from scratch (note I'm new to javascript and coding overall).

The logic from my drawings is in the code and to me it should work just like that. But I'm probably missing something.

Basically what I want it to do:
All slides are not visible
show slide 1, wait a second
hide slide 1, open slide 2, wait a second
hide slide 2, open slide 3, wait a second
"
"
hide slide 5, repeat.

https://code.sololearn.com/W3A2224a14a1

Answer 1

https://code.sololearn.com/WI4n3kxR478X/?ref=app

Answer 2

That doesn't solve my question, I specifically stated I wanted to make this in Javascript. @Kintu

Answer 3

What may work better is appending each image to the dom per iteration. There are tons of resources on how you may go around doing this. The way I normally do it is make an array of image paths and loop through them. there are other ways to do this though, i will link a great tutorial on a way you can do this..

Answer 4

https://youtu.be/KcdBOoK3Pfw

Answer 5

@visph Thanks a lot!!! It runs so smooth too :D
But just for better understanding:

I needed to use 'else' if statements and put the wait timer under all other js lines?As well as some better css to make it look better ofcourse!

Thanks for your help, hope you have a great evening!

Answer 6

Samuel try out bootstrap bootstrap is much more better than js