Как обратиться к динамически созданному элементу внутри selectable?

Question

[aristarhandrianov]

День добрый!
Подскажите как можно обратиться к динамически созданному элементу внутри selectable

Мой код:

.selectable({
	filter: 'section',	
	stop: function(event, ui) { 
		$(document).find('.sectionTools').remove();
		$('.ui-selected').children().append(""
		+"<div class='sectionTools'>"
		+"<span class='tool tool-move ico'>{}</span>&#8194;"
		+"<span class='tool tool-remove ico'>'</span>"
		+"</div>");

		// Следующая функция не срабатывает
		$('.tool-remove').on( "click", function() {
			$('.ui-selected').remove();
		});
	}
	
});

Comments

[Евгений Петров]

А слабо пример создать на jsfiddle.net?
Когда же вопросы будут задавать нормально...

Answer 1

[Виталий Яковенко]

Можно так:

var toolremove = $("<span class='tool tool-remove ico'>'</span>").click(function () {
  $('.ui-selected').remove();
});
var sectiontools = $("<div class='sectionTools'>"
    +"<span class='tool tool-move ico'>{}</span>&#8194;"
    +"</div>").append(toolremove);
$('.ui-selected').children().append(sectiontools);

Или так:

$('.ui-selected').children().append($("<div class='sectionTools'>"
    +"<span class='tool tool-move ico'>{}</span>&#8194;"
    +"<span class='tool tool-remove ico'>'</span>"
    +"</div>").children('.tool-remove').click(function() {
      $('.ui-selected').remove();
    }).parent());

Comments

[aristarhandrianov]

Очень странный логически код получился, но работает:) Спасибо!

[Виталий Яковенко]

aristarhandrianov: почему же странный? Просто создаем блок не целком, а "задом-наперед", влаживая друг в дружку.

[aristarhandrianov]

Отлично!
Вот только теперь не работает предварительное удаление блока sectionTools
$('.sectionTools').remove();
Без этой строки все идеально, а с ней полтергейст:
Удаляется сам sectionTools при клике на tool-remove, а не .ui-selected
Я в замешательстве

Answer 2

[Сергей Мельников]

$('.ui-selected').on( "click", '.tool-remove', function() {
  $('.ui-selected').remove();
});

Comments

[aristarhandrianov]

Пробовал не работает(

Answer 3

[IVAN SAVCHENKO]

Не работает видимо потому что к динамически созданным элементам не биндится событие клика. Надо обращаться через document

Comments

[aristarhandrianov]

Тоже пробовал(

Answer 4

[Роман Романович]

$('body').on( "click", '.tool-remove', function() {
  $('.ui-selected').remove();
});