find img attribute and change src value inside divs

Question

I have a structure like:

<div id="so1" class="card over"  data-direction="right" gal="gal1" >        
      <div class="front" >
    <img src="img1.jpg" width ="100%;" height ="100%;" alt="">
      </div>         
      <div class="back" style="background-color:#99ca3c;">
      </div>         
</div>

to recognize this sections I do

change_it = function (id,effect, img ) {
   $('#' + id).toggleClass(effect);
   $('#' + id).attr('img', img);
} 

I call it

change_it ("so1", "flipping-right" ,"imgs/img1/2.jpg");

However it is not changing its value, How can I access this img attribute, if I only have id of parent div? I mean, the structure is div->div->img

Answer 1

You need to find the image and change its src attribute:

change_it = function (id,effect, img ) {
   $('#' + id).toggleClass(effect);
   $('#' + id).find('img').attr('src', img);
} 

Answer 2

Here so1 is div id but you are using

$('#' + id).find('img').attr('src', img);

for a div.

Here you need to find the image tag first existed in that div.Then change the src of that image.

Answer 3

如果要将img分配给div，则可以设置其背景图像。

$('#' + id).css('background-img', 'url(' + imageUrl + ')'