Как изменить изображение после нажатия кнопки отправки?

Question

Я хочу код для вопросника. с каждым ответом на вопрос (текстовый формат) изменение изображения с нажатием кнопки submit и увеличение полосы выполнения.

Я должен изменить 3 вещи одним щелчком мыши.

1. вопрос
2. изображение
3. прогресс бар

<script> 
    var img_array = ['placehold.it/100x100/green';, 'placehold.it/100x100/blue';, 'placehold.it/100x100/red']; 
    i = 0; 
    function myFunction() { 
     i++; 
     document.getElementById("myImg").src = img_array[i]; if (i == img_array.length - 1) { i = -1; } 
    } 
</script> 

Answer 1

Если вы хотите изменить изображение для изображения, то это является образцом

document.getElementById('theImage').src="image.png"; 

Если вы хотите изменить фоновое изображение кнопки, то это образец

document.getElementById("button").style.backgroundImage = "url('http://image/1917/crossn.png')"; 
    button.style.backgroundRepeat = "no-repeat"; 

Answer 2

Я должен изменить 3 вещи одним щелчком мыши. вопрос изображение прогресс бар

Пример кода HTML:

<div id="myQuestion">Qeuestion1</div> 
<img src="test" id="myImg" /><br/> 
<progress id="progressId" value="0" max="100"></progress><br/> 
<button id="buttonId" onClick="myFunction()">submit</button> 

Sample Javascript код:

$(document).ready(function(){ 
var qus_array = ['Question1','Question2','Question3'] 
var img_array = ['placehold.it/100x100/green', 'placehold.it/100x100/blue', 'placehold.it/100x100/red']; 
var i = 0; 
    $('button').click(function(){ 
     i++; 
     document.getElementById("myQuestion").innerHTML = qus_array[i]; 
     document.getElementById("myImg").src = img_array[i]; 
     document.getElementById("progressId").value = 33*i; 
     if (i == img_array.length - 1) { i = -1; } 
    }) 
}); 

Смотрите JSFiddle