Lukasz Kisicki Lukasz Kisicki - 4 months ago 8
jQuery Question

JQuery click funtion order

I would like to know how can I change the background-image of another div element, when I click on it. I would like to see images one after another in order but what I get is the last one. Here is some code:

$(document).ready(function () {
// console.log('ready!');

$('.right').click(function () {
}).click(function() {
}) }).click(function() {


Instead of adding multiple event handler use single. Inside handler change images from the array with help of a counter variable.

$(document).ready(function() {
  // store images in an array
  var images = ['url(images/sail-boat.jpg)', 'url(images/sad_ostateczny.jpg)', 'url(images/twierdza_wisloujscie.jpg)'],
    //  variable to store index  
    i = 0;
  $('.right').click(function() {
    // update index based on array length
    i = i % images.length;
    // update background from array using the index value
    $('.zur-gda-img').css('background', images[i++]);