JS link OOB option.

For CSR development always use Chrome and the Extension Cisar, it does the templating for you and manages all the JSLinks for you, it is the best thing since sliced bread..

https://chrome.google.com/webstore/detail/cisar/nifbdojdggkboiifaklkamfpjcmgafpo?hl=en

Then replace that MSDN code for a Status color in a View with:

function statusColor( ctx, CurrentFieldSchema, CurrentItem, ListSchema ){
        if (CurrentItem.hasOwnProperty(CurrentFieldSchema.Name + '.groupHeader')) { 
            //do nothing when this Choice field is used in a Group By 
            return CurrentItem[CurrentFieldSchema.Name];
        }
        var _status=CurrentItem[ CurrentFieldSchema.Name ].Label,            _html='<span style="color:{0}; font-weight:{1};">{2}</span>',            _color='none',            _weight='bold';
        switch(_status){
            case('Not Started'):
            case('OnHold'):                _color='gold';
                break;
            case('Active'):                _color='green';
                break;
            case('Completed'):                _color='blue';
                break;
            case('At Risk'):
            case('Cancelled'):
            case('Overdue'):                _color='red';
                break;
            default:                _html='{2}';
        }
        return( String.format(_html, _color, _weight, _status) );
}