Изменение IMG SRC создан с помощью appendTo

Question

Я создал кнопку с помощью функции appendTo:

$('<span id="metroBtn" class="play_btns"><img src="pngs/metro.png"></span>').appendTo('#cardSlots'); 

Я пытаюсь изменить IMG SRC с помощью следующих, но это не работает:

$('#cardSlots').on('click', '#metroBtn', function(){ 
    $(this).attr('src','pngs/new_img.png'); 
} 

Пожалуйста, порекомендуйте.

Answer 1

В вашем jquery $(this) ссылается на элемент, к которому прикреплено событие click, которое является оберткой #metroBtn. Чтобы изменить источник, вам необходимо настроить таргетинг на img. Вы можете сделать это с помощью метода find():

$(this).find('img').attr('src','pngs/new_img.png'); 

Codepen Example