Смена фонового изображения по кругу, по клику на одну кнопку

[Manoftheyear]

Доброго времени суток.
Просвещённые и неравнодушные помогите, пожалуйста, написать функцию в jquery для смены фонового изображения у дива с классов "imghead", смена должна происходить по клику на баттон с классом "btn-hdbg". Ещё нюанс, чтобы смена была круговой, а не заканчивалась на последнем изображении.

Начал код так:

$(function(){
	var images [
				'images/header-bg2.jpg',
				'images/header-bg3.jpg',
				'images/header-bg4.jpg',
				'images/header-bg5.jpg'
		],
	$div = $(".imghead");
	$(".btn-hdbg").click(function() {
			// Как это здесь оформить?
	});
});

[Vlasenko Fedor]

! function($) {
  var images = [
      'images/header-bg2.jpg',
      'images/header-bg3.jpg',
      'images/header-bg4.jpg',
      'images/header-bg5.jpg'
    ],
    $div = $(".imghead");

  function next(arr) {
    var i = 0;
    return function() {
      return arr[i++ % arr.length];
    };
  }
  var newImg = next(images);
  $(".btn-hdbg").on('click', function() {
    $div.css('backgroundImage',  'url(' + newImg() + ')');
  });
}(window.jQuery);

[Manoftheyear]

Poznakomlus, спасибо за отклик. Скопипастил, но он не пашет -=((

[Vlasenko Fedor]

Скопипастил, но он не пашет -=((

<div class="imghead"></div>
<div class="imghead"></div>
<div class="imghead"></div>
<button class="btn-hdbg">Click me</button>
<script src='http://code.jquery.com/jquery-1.9.1.js'></script>
<script>
! function($) {
  var images = [
      'images/header-bg2.jpg',
      'images/header-bg3.jpg',
      'images/header-bg4.jpg',
      'images/header-bg5.jpg'
    ],
    $div = $(".imghead");

  function next(arr) {
    var i = 0;
    return function() {
      return arr[i++ % arr.length];
    };
  }
  var newImg = next(images);
  $(".btn-hdbg").on('click', function() {
    var url =  'url(' + newImg() + ')';
    $div.css('backgroundImage', url);
    $div.text(url);
  });
}(window.jQuery);
</script>

[Manoftheyear]

Удалённый файл, вместо http://code.jquery.com/jquery-1.9.1.js у меня был иной видимо подключен. Сейчас хоть какое-то движение, после первого нажатия фон меняется, но кнопка пропадает -=))) и всё. И это если скрипт вшит в хтмл-документ, если подключать отдельным файлом, то вообще не работает.

[Manoftheyear]

Проблема найдена. Всё потому, что кнопка находится внутри самого дива. А можно реализовать, чтобы кнопка не пропадала внутри дива? И почему скрипт не пашет из внешнего файла?

[Vlasenko Fedor]

почему скрипт не пашет

$(documen).ready(function(){
	 $(".btn-hdbg").on('click', function() {
    var url =  'url(' + newImg() + ')';
    $div.css('backgroundImage', url);
  });
});

данный код изменяет backgroundImage
никакого отношения к кнопке он не имеет

[Manoftheyear]

Poznakomlus, большое спасибо за помощь, всё нормально!