jquery - スパン要素から特定のクラスを持つすべての要素を削除します

Question

HTML:

<script src="../../Scripts/notificator.js" type="text/javascript"></script>

<span id="popUpMessageBoard"/>
<button onclick="success('message', 'popUpMessageBoard')">Add</button>
<button onclick="remove('popUpMessageBoard')">Remove</button>

JavaScript:

success = function (messageToApply, elementIdToApplyMessages) {
    $('#' + elementIdToApplyMessages).append('<strong class="notification" style="color:blue">' + messageToApply + ' </strong>');
};

remove = function (elementId) {
    $('#' + elementId).remove('.notification');
}

はAdd buttonに要素を追加しますpopUpMessageBoard span element。削除ボタンをクリックすると、 を持つすべての要素が.notification class親スパン要素から削除されます。何が欠けていますか？

Answer 1

このメソッドは、一致したセットにある.remove()要素を削除します。セレクターを渡すと、一致したセットが単純にフィルター処理されます。あなたの場合、このフィルタリングにより空の要素セットが残り、何も削除されません。

一致したセット内の要素の子孫を削除する必要があります。.find()これらの子孫を取得するには、(または利用可能な他の多数の方法のいずれか) を使用できます。

$('#' + elementId).find('.notification').remove();

Answer 2

このようにcssセレクターを変更する必要があります

remove = function (elementId) {
    $('#' + elementId).children('.notification').remove();
}

Answer 3

$('#' + elementId + ' > .notification').remove();