javascript - parent().remove が正しく機能しない

Question

.icon-trash をクリックして親を削除すると問題が発生します

<div class="ui-wrapper ui-draggable">
  <img id="link1" class="decor ui-resizable" src="http://i.imgur.com/nYkdOne.png">
  <div class="ui-resizable-handle ui-resizable-e" style="z-index: 90;"></div>
  <div class="ui-resizable-handle ui-resizable-s" style="z-index: 90;"></div>
  <div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se" style="z-index: 90;"></div>
  <img class="icon-layer-up icon-on-img" src="" style="z-index: 1;">
  <img class="icon-layer-down icon-on-img" src="" style="z-index: 1;">
  <img class="icon-trash icon-on-img" src="" style="z-index: 1;">
  <img class="icon-copy-el icon-on-img" src="" style="z-index: 1;">
</div>

私のjsコードは、クラスが.icon-on-imgの要素のみをデリートしています

$(document).on('click', '.icon-trash', function() {  
  $(this).parent().remove();
});

.icon-trash 要素をクリックしてすべてを削除するにはどうすればよいですか?

Answer 1

ここでの作業例: (オレンジ色のボックスをクリック) http://jsfiddle.net/cpEff/

親divからjQueryにクラス「.ui-wrapper」を追加しました

$(document).on('click', '.icon-trash', function() {  
  $(this).parent('.ui-wrapper').remove();
});

Answer 2

これを試して

  $(document).ready(function () {
        $(".icon-trash").on("click", function () {
            $(this).parent().remove();
        });
    });

Answer 3

イベントで body を使用する

$('body').on('click', '.icon-trash', function() {  
    $(this).parent().remove();
 });

作業中のjsfiddle http://jsfiddle.net/HdMNY/

Answer 4

次のコードが機能するはずです。

$('.icon-trash').on('click', function() {  
  $(this).parent().remove();
});