HTML两个div间颜色过渡,给div加一个移入后显示渐变色，但是transition过渡效果缺没生效...

问题如题：

代码如下:

html:

css:

.box{

width: 100px;

height:100px;

background: #fff;

-webkit-transition: all 0.4s cubic-bezier(.4,0,.2,1) 0s;

-moz-transition: all 0.4s cubic-bezier(.4,0,.2,1) 0s;

-ms-transition: all 0.4s cubic-bezier(.4,0,.2,1) 0s;

-o-transition: all 0.4s cubic-bezier(.4,0,.2,1) 0s;

transition: all 0.4s cubic-bezier(.4,0,.2,1) 0s;

}

.change {

background: -webkit-gradient(linear, 0 0, 100% 100%, from(#6E45E2),to(#88D3CE));

}

js代码如下:

$('.venueModel').on('mouseover',function () {

$(this).addClass('change');

}).on('mouseleave',function () {

$(this).removeClass('change');

});

其中：transition没生效。。。求解!在线等！急！