Duplicating Javascript To Work Twice On A Page

I'm trying to get a bit of javascript to work twice one a single page, what I'm trying to do is get a bunch of images scrolling, in 2 sets. If you may take a look here (The images within the "recent" and random "tabs").

What I did was duplicate the original code and edited the function names by adding "3" onto the end.


JavaScript Code:
gOverCWScroller = false;
 
function CWScroller(ulId, speed) {
 
    this.container = document.getElementById(ulId);
    this.container.Scroller = this;
    this.speed = speed;
 
    this.container.onmouseover = function(e) {
        gOverCWScroller = true;
    }
 
    this.container.onmouseout = function(e) {
        gOverCWScroller = false;
    }
 
    this.scroll = function() {
        if (gOverCWScroller == false) {
            var c = this.container.firstChild;
            var first = null;
            while (c) {
                if (c.tagName == 'LI') {
                    first = c;
                    break;
                }
                c = c.nextSibling;
            }
            var nodeSize = 78;  // Default
            var px = 0;
            nodeSize = first.clientWidth;
            if (first.style.marginLeft != '') {
                px = parseInt(first.style.marginLeft);
            }
            first.style.marginLeft = ( px - 1 ) + 'px'
            if ( parseInt(first.style.marginLeft) <= -(nodeSize) ) {
                first.style.marginLeft = &#390;px'
                this.container.removeChild(first);
                this.container.appendChild(first);
            }
        }
        setTimeout('document.getElementById('' + this.container.id + '').Scroller.scroll()', this.speed); 
    }
 
    setTimeout('document.getElementById('' + ulId + '').Scroller.scroll()', this.speed);
 
}


JavaScript Code:
gOverCWScroller3 = false;
 
function CWScroller3(ulId, speed) {
 
    this.container = document.getElementById(ulId);
    this.container.Scroller3 = this;
    this.speed = speed;
 
    this.container.onmouseover = function(e) {
        gOverCWScroller3 = true;
    }
 
    this.container.onmouseout = function(e) {
        gOverCWScroller3 = false;
    }
 
    this.scroll3 = function() {
        if (gOverCWScroller3 == false) {
            var c = this.container.firstChild;
            var first = null;
            while (c) {
                if (c.tagName == 'LI') {
                    first = c;
                    break;
                }
                c = c.nextSibling;
            }
            var nodeSize = 78;  // Default
            var px = 0;
            nodeSize = first.clientWidth;
            if (first.style.marginLeft != '') {
                px = parseInt(first.style.marginLeft);
            }
            first.style.marginLeft = ( px - 1 ) + 'px'
            if ( parseInt(first.style.marginLeft) <= -(nodeSize) ) {
                first.style.marginLeft = &#390;px'
                this.container.removeChild(first);
                this.container.appendChild(first);
            }
        }
        setTimeout('document.getElementById('' + this.container.id + '').Scroller3.scroll3()', this.speed);   
    }
 
    setTimeout('document.getElementById('' + ulId + '').Scroller3.scroll3()', this.speed);
 
}

This all works fine and dandy, however, I can only get one of the image sections to scroll. It's something to do with this:


HTML4Strict Code:
<script language="javascript" type="text/javascript">
CWScroller('scroller', 30, 'horizontal');
CWScroller3('scroller3', 30, 'horizontal');
</script>

If I leave out "CWScroller3('scroller3', 30, 'horizontal');" the recent section of images will scroll but the random images wont. If I put in "CWScroller3('scroller3', 30, 'horizontal');" it'll overwrite the the original recent section, and that won't scroll.