How can I get jQuery to return a valid img src?

So, I have images in a div that use the same class, and one of them is selected at a time for one view of this image. In this single view, I have arrows that I want to use to cycle through images. Images that have the same class have sequential alt values.

Right now, I can get the previous alt value and set the src of the image in a single view for the source of this image. But it seems I can’t get the same effect with the following image.

    $("#leftButton").click(function(){
            var current= $('img[id="selected"]');
            var altVal=current.attr("alt").valueOf()-1;
            if(altVal>=0)
            {
                var next= $('img[alt='+altVal+']');
                current.attr("id", "");
                next.attr("id", "selected");
                $("#embiggenImage").attr("src", next.attr("src"));
            }
        }
    );

    $("#rightButton").click(function(){
            var gal=$('img[class="galleryImage"]');
            alert(gal.length);
            var current= $('img[id="selected"]');
            var altVal=current.attr("alt").valueOf()+1;
            if(altVal<gal.length)
            {
                alert("inside");
                var next= $('img[alt='+altVal+']');
                current.attr("id", "");
                next.attr("id", "selected");
                $("#embiggenImage").attr("src", next.attr("src"));
            }
        }
    );

As you can see, the code for changing sources is exactly the same, and it reaches these two warnings in order, but returns a null source.

: , clickButton, alt , , alt, '1', altVal - '01'. .