Using jQuery to change the background image

Question

I am trying to use jQuery to change the background image in a table cell, the table cell has its own class .active. I use jQuery to change other elements in the same place and they all work fine, so I think there should be something wrong in the syntax. the function I use is executed after the button is clicked. my code is:

function vehicle(arg){
  $(".active").css("color", "blue");  
  $(".active").css("background-image", "url(../img/car.png)");
};

CSS

.active{
  background-size: 10px 10px;
  background-repeat: no-repeat;
  border-right: 1px solid none;

The first line runs fine, I tried the following code plus resized the image in every way that I can think of:

   $(".active").css("background-image", "../img/car.png");
   $(".active").css("background-image", "url('../img/car.png')");

can anyone point out what i did wrong?

Answer 1

.css() . :

$(".active").css("background-image", "url('img/car.png')");

, img/ , , . Else .

Answer 2

, .

$( ". active" ). attr ( "", "background-image: url (' url')" );

Answer 3

You can set the CSS class to change the image.

CSS

.img1{
    background-image:img/car1.png;
}

.img2{
    background-image:img/car2.png;
}

Jquery:

$(".active").removeClass('img1').addClass('img2');