javascript - 技術セレクターで要素をラップする最良の方法

Question

プロジェクトでは、HTML 文字列から要素を追加/置換して DOM を操作することがよくあります。

$("#myDiv").html("<ul><li>foo</li><li>bar</li></ul><p>This is a list</p>");

jQueryセレクターがページのこれらの特定のフラグメントをターゲットにできるように、それらを「技術IDが添付されたもの」でラップしたいと思います。

そんな感じ ：

var techId = ...; 
$("#myDiv").html(wrap(techId, "<ul id="myList"><li>foo</li><li>bar</li></ul><p>This is a list</p>"));
$(document).on("click", "#"+techId+" #myList", function(event){
    alert("List clicked");
});

どのような状況でも、ラッパーがページに視覚的な影響を与えることができないことを知っている「ラップ」関数のコンテンツはどうあるべきか。

ラッパーで .remove() を呼び出すと、ラップされた要素が削除されますが、内部の要素を変更せずにラッパーを削除する方法が必要です (セレクターを壊すことを犠牲にして)。