Jquery slideshow med klik

Hej Eksperter

Jeg prøver at få noget til at virke hvor man kan trykke til frem eller tilbage så den skifter billede.
Men når jeg klikker til en af siderne forsvinder det hele bare.
Den kode jeg leger med lige nu er:
CSS:

#galleri{
    width:800px;
    height:400px;
    position:relative;
    background-color:#09C;
}
.next{
    width:60px;
    height:60px;
    background-color:#333;
    position:absolute;
    top:45%;
    right:0;
}
.tilbage{
    width:60px;
    height:60px;
    background-color:#CCC;
    position:absolute;
    top:45%;
    left:0;
}
#galleri img {
    position:absolute;
    height:400px;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
}


Htmlen:

<div id="galleri">
<div class="next"></div>
<img src="../slideshow/06-04-2017(01).png" />
<img src="../slideshow/06-04-2017(01).png" />
<div class="tilbage"></div>
</div>

JS:
var klik_galleri =
{
    ready:function()
    {
        $('#galleri img:gt(0)').hide();
        $(function(){
            $('.next').click(function(){
                $('#galleri:first-child').fadeOut().next('img').fadeIn("slow").end().appendTo('#galleri');
            })
        })
       
        $(function(){
            $('.tilbage').click(function(){
                $('#galleri:last-child').fadeOut().prev('img').fadeIn("slow").end().appendTo('#galleri');
            })
        })
    }
}
$(document).ready(klik_galleri.ready);

Med venlig hilsen
Morten