JavaScript Module - Increment value in array.

JavaScript Module - Increment value in array.

HTML

<span id="print"></span>

<button onclick="Next.changeText();">Click</button>

JavaScript

var s;
var ele;
Next = {
    
    settings : [
        {color : 'green'},
        {color : 'yellow'},
        {color : 'red'}
    ],
    
    elements : {
         span : $('#print')
    },
    
    init : function() {
        //kick things off
        s = this.settings;
        ele = this.elements;
        this.bindUIActions();
    },

    bindUIActions : function() {
        ele.span.ready(function() {
            Next.loadText();
        });
        ele.span.on('click', function() {
            Next.changeText();
        });
    },
    
    loadText : function() {
        ele.span.text(s[0].color);
    },

    changeText : function() {
        var index = Next.indexOfColor(ele.span.text());
        if(index < s.length-1) {
            ++index;
            ele.span.text(s[index].color);
        } else {
            ele.span.text(s[0].color);
        }
    },
    
    indexOfColor: function (color) {
        for(var i=0; i < s.length; i++) {
           if(s[i].color == color) 
               return i; 
        }
        return -1;
    }
    
};

(function() {
    Next.init();
})();