Александр Панасин

Если блока стоит следующим за кнопкой можете применить +
.html

<div>
  <button class='button-replace-image'>Кнопка</button>
  <div class='replace-image'></div>
</div>

.css

.replace-image { background:url(...) ...; } // Текущее изображение
.button-replace-image:hover + .replace-image { background-image:url(...) } // Новое изображение. При наведении на кнопку следующий блок сменит фоновое изображение

Если блок в том же селекторе то ~
.html

<div>
  <button class='button-replace-image'>Кнопка</button>
  <div>Текст</div>
  <div class='replace-image'></div>
</div>

.css

.replace-image { background:url(...) ...; } // Текущее изображение
.button-replace-image:hover ~ .replace-image { background-image:url(...) } // Новое изображение. При наведении на кнопку все следующие блоки .image сменят фоновое изображение

Если блок где-то в неопределенном месте то js
.html

<div>
  <button class='js--button-replace-image' data-selector='js--replace-image'>Кнопка</button>
  <div class='replace-image js--replace-image'></div>
</div>

.js

$('.js--button-replace-image').on('mouseenter', function () {
  var $this = $(this);
  var selector = $this.data('selector');
  $(selector).addClass('--replace');
});
$('.js--button-replace-image').on('mouseleave', function () {
  var $this = $(this);
  var selector = $this.data('selector');
  $(selector).removeClass('--replace');
});

.css

.replace-image { background:url(...) ...; } // Текущее изображение
.replace-image.--replace{ background-image:url(...) } // Новое изображение