Scroll with buttons in javascript

I'm trying to make a series of horizontal scrolls that scroll with two buttons in javascript and for now this is what I have, to see if you can help me. I've done the code like that a bit roughly.

That is, imagine a horizontal list with images, and every time you give a button move three by three, something like that. In the middle are the divs and the lateral ones, external to the middle div, the buttons.

HTML

<div class="flechaizquierda">
<a id='izquierda'><img src='izquierda.png'></a>
</div>

<div id="contenedor">
<div id="cajauno">
<img class="imagen">
<div class="texto">
<h5>Texto</h5>
</div>
</div>
<div id="cajados">
<img class="imagen">
<div class="texto">
<h5>Texto</h5>
</div>
</div>
<div id="cajatres">
<img class="imagen">
<div class="texto">
<h5>Texto</h5>
</div>
</div>
<div id="cajacuatro">
<img class="imagen">
<div class="texto">
<h5>Texto</h5>
</div>
</div>
<div id="cajacinco">
<img class="imagen">
<div class="texto">
<h5>Texto</h5>
</div>
</div>
</div>

<div class="flechaderecha">
<a id='derecha'><img src='derecha.png'></a>
</div>

</div>

Jquery

<script>
$(function(){
    $('#izquierda').toggle(
        function(){
            $("#contenedorreco").animate({"left": "1500px"}, "slow");
        }, function(){
            $(".#contenedorreco").animate({"left": "-1500px"}, "slow");
        }
    );
});
$(function(){
    $('#derecha').toggle(
        function(){
            $("#contenedorreco").animate({"right": "1500px"}, "slow");
        }, function(){
            $(".#contenedorreco").animate({"right": "-1500px"}, "slow");
        }
    );
});
</script>

I would appreciate if you could help me because I am desperate.