Настройка фонового изображения динамически ul/li div element

Question

Я новичок в разработке сайтов и пытаюсь выяснить, как установить изображение динамически в ul/lidiv элемент. Ниже мой код в HTML файл:

<div class="results"> 
    <ul class="row"> 
     <li class="template hidden col-md-3"> 
      <div class="image"> 
       <!--img src='broken_file.png'--> 
       <data> 
        <span class="name"></span> 
        <span data-before='faces' class="faces"></span> 
        <span data-before='genus' class="genus"></span> 
        <span data-before='vertices' class="vertices"></span> 
       </data> 
      </div> 
     </li> 
    </ul> 
</div> 

И из других JS файла Я пытаюсь получить доступ к «изображение» Дива, как

$(li).find('image').css() 

Я пытаюсь установить адрес изображения внутри css(), но не уверен, как я могу это сделать, или даже это возможно?

Answer 1

Во-первых, ваш синтаксис jQuery неверен. li должен быть в кавычках, так как это строка, а селектор image требует предшествующего ., так как это класс. Наконец, вы можете установить background-image в CSS, например:

$('li').find('.image').css('background-image', 'url("my-image.png")'); 

Answer 2

1) Если вы хотите вставить IMG тег в DIV с классом "изображения" -

$('li').find('.image').append($('<img src="http://fakeimg.pl/250x100/000/">')) 

2) Если вы хотите изменение src attr -

$('li').find('.image img').attr('src','http://fakeimg.pl/250x100/000/">')