I want to change the image in CSS from HTML like a gallery

See more:

Javascript

CSS

HTML

jQuery

this is the html code :

<div class="Winter">

</div>

right now i have not get background image.


this is the css code :

.Winter{
	background: no-repeat center bottom scroll;
	background-image:;	
	width:410px;
	height:410px;
	float:left;
	margin-top:20px;
	margin-left:5px;
}

i dont set a backgourd image because i use in this to change the background :

<script src="http://code.jquery.com/jquery-1.11.0.min.js">
$(document).ready(function(){
var Winter = $('body');

var backgrounds = new Array(
, 'url(img/winter/earwarmers/9.jpg)'
, 'url(img/winter/hats/7.jpg)'
, 'url(img/winter/jacket/4.jpg)'
);

var current = 0;

function nextBackground() {
current++;
current = current % backgrounds.length;
Winter.css('background-image', backgrounds[current]);
}
setInterval(nextBackground, 1000);

Winter.css('background-image', backgrounds[0]);
});
</script>

now i ask this :

i dont have background image
but i want background image so how can i change the background image from the html page that in the css page it change?

and how can i do that thr image go in loop in javascript or jquery?

help me plz

What I have tried:

i try to change the div class to id and set get by element id but noyhing change