Edit in JSFiddle

// Gradient Colors

// Define variable colors
	var back = ["#22A7F0","#8E44AD","#AEA8D3","#F62459","#DB0A5B","#D64541","#D2527F","#2C3E50","#1E8BC3","#87D37C","#4ECDC4","#3FC380","#E87E04","#F9690E","#F9BF3B"];
	
	$('.item').each(function() {
		
		var rand1 = back[Math.floor(Math.random() * back.length)]; // First color
		var rand2 = back[Math.floor(Math.random() * back.length)]; // Second Color
		
		var grad = $(this);
		
		grad.css('background-color', rand1 );
		grad.css("background-image", "-webkit-gradient(linear, left top, left bottom, color-stop(0%,"+ rand1 +"), color-stop(100%,"+ rand2 +"))");
		grad.css("background-image", "-webkit-linear-gradient(top,  "+ rand1 +" 0%,"+ rand2 +" 100%)");
		grad.css("background-image", "-o-linear-gradient(top, "+ rand1 +" 0%,"+ rand2 +" 100%)");
		grad.css("background-image", "-ms-linear-gradient(top, "+ rand1 +" 0%,"+ rand2 +" 100%)");
		grad.css("background-image", "linear-gradient(to bottom, "+ rand1 +" 0%,"+ rand2 +" 100%)");
		grad.css("filter", "progid:DXImageTransform.Microsoft.gradient( startColorstr='"+ rand1 +"', endColorstr='"+ rand2 +"',GradientType=0 )");
        
	});
<div class="container">
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
</div>
.container {
    width: 100%;
}
.item {
    width: 25%;
    height: 200px;
    float: left;
}