Random Background Directive

backgrounds.css

// backgrounds: 
.bgRed {
    background-color: rgba(255,0,0,0.5)!important; 
}

.bgYellow {
    background-color: rgba(255,204,0,0.5)!important; 
}

.bgGreen {
    background-color: rgba(81,216,4,0.5)!important; 
}

randomBackground.js

app.directive("randomBackground", function () {
    return {
        restrict: 'EA',
        replace: false,
        link: function (scope, elem, attr) {
        var classes = ["bgRed", "bgGreen", "bgYellow"];             
        
        //Add random background class to selected element
        elem.addClass(classes[Math.floor(Math.random() * (classes.length))]);
        }
    }
});