Change div background image with jQuery

Question

Hey guys, I'm trying to change the background image of multiple divs with the class .innerpreview when a drop down selection is made. Any idea why the following isn't working?

$('#txtMontage').change(function(event) {
    if (this.value == "example") {
        $('.innerpreview').css('background-image', 'img/img-bkg.jpg)');
    }
});

Thanks in advance.

Answer 1

Missing url( ... thanks Ender:

$('#txtMontage').change(function(event) {
    if (this.value == "example") {
        $('.innerpreview').css('background-image', 'url(img/img-bkg.jpg)');
    }
});

I would also not use this, but create a new class in CSS with the background image specified, and change or add this new class.

Answer 2

I think the problem is that you are missing the "url()" bit of setting the background image. You should have something like this:

$('#txtMontage').change(function(event) {
    if (this.value == "example") {
        $('.innerpreview').css('background-image', 'url(img/img-bkg.jpg)');
    }
});

See this question: Switching DIV Background Image With jQuery