JQuery Not Working in Chrome

This code works properly in Firefox but not in Chrome, If you need more of the code I would be glad to provide it, a button changes a background image:

$(document).ready(function() {
var bg = 1;
$("#changePic").click(function开发者_StackOverflow () {
    if (bg == 1)
    {
        $("#outerWrapper").css("background-image","url(images/background-lodge1.jpg");
        bg=2;
    }
    else if (bg == 2)
    {
        $("#outerWrapper").css("background-image","url(images/background-lodge2.jpg");
        bg=3;
    }
    else
    {
        $("#outerWrapper").css("background-image","url(images/background-lodge.jpg");
        bg=1;
    }
  });
});

I'm not getting any errors in the Chrome Console. Thanks!

you are not closing the url for the background

 $("#outerWrapper").css("background-image","url(images/background-lodge.jpg)");
                                                               was missing ^

As an aside, you can really factor out a lot of that common code:

$(document).ready(function() {
    var bg= 0;
    $("#changePic").click(function () {
        bg= (bg+1) % 3;
        var name= ["lodge", "lodge1", "lodge2"][bg];
        $("#outerWrapper").css("background-image", "url(images/background-"+name+".jpg)");
    });
});

To see what javascript errors are there in chrome, press "ctrl+shift+I" and go to console tab. or "ctrl+shift+J" to go to Console tab directly.