Javascript 如何在删除并再次添加该函数后使其工作

我不确定这个的正确标题是什么。我的问题是，在单击并更改标题后，它不再在单击时触发

请看下面的小提琴：

HTML

<h2><span class="ss-icon ss-repeat"></span> 
        <span id="campaignEditTitle">Click Me to Edit <small><span class="ss-write"></span></small></span>
        <small> &nbsp; 3 Messages (2 active, 1 draft)
        </small>
      </h2>


单击我进行编辑
3条消息（2条活动消息，1条草稿消息）

JS

$('#campaignEditTitle').on('click', function(){
        var title = $(this).text();
        $(this).replaceWith('<input id="campaignInputTitle" type="text" value="' + title + '">');
        console.log(title);

        $('#campaignInputTitle').keypress(function(e) {
            if(e.which == 13) {
                var newTitle = $(this).val();
                $(this).replaceWith('<span id="campaignEditTitle">' + newTitle + '<small><span class="ss-write"></span></small>');
            }
        });
        $('#campaignInputTitle').on('blur', function(){
            var newTitle = $(this).val();
            $(this).replaceWith('<span id="campaignEditTitle">' + newTitle + '<small><span class="ss-write"></span></small>');
        });        
    });

$（“#活动编辑标题”）。在（'click'，function（）上{
var title=$（this.text（）；
$（此）。替换为（“”）；
控制台日志（标题）；
$（“#活动输入标题”）。按键（功能（e）{
如果（e.which==13）{
var newTitle=$（this.val（）；
$（this）.替换为（“”+newTitle+“”）；
}
});
$（“#活动输入标题”）。在（'blur'，function（）上{
var newTitle=$（this.val（）；
$（this）.替换为（“”+newTitle+“”）；
});        
});
通过使用事件委派：

$('body').on('click','#campaignEditTitle', function(){
    var title = $(this).text();
    $(this).replaceWith('<input id="campaignInputTitle" type="text" value="' + title + '">');
    console.log(title);

});

$('body').on('keypress','#campaignInputTitle',function(e) {
        if(e.which == 13) {
            var newTitle = $(this).val();
            $(this).replaceWith('<span id="campaignEditTitle">' + newTitle + '<small><span class="ss-write"></span></small>');
        }
});

$('body').on('blur','#campaignInputTitle', function(){
        var newTitle = $(this).val();
        $(this).replaceWith('<span id="campaignEditTitle">' + newTitle + '<small><span class="ss-write"></span></small>');
});  

$（'body'）。在（'click'，'campaignEditTitle'，函数（）上{
var title=$（this.text（）；
$（此）。替换为（“”）；
控制台日志（标题）；
});
$（'body'）。在（'keypress'，'#activationInputTitle'，函数（e）上{
如果（e.which==13）{
var newTitle=$（this.val（）；
$（this）.替换为（“”+newTitle+“”）；
}
});
$（'body'）。在（'blur'、'{
var newTitle=$（this.val（）；
$（this）.替换为（“”+newTitle+“”）；
});  
通过使用事件委派：

$('body').on('click','#campaignEditTitle', function(){
    var title = $(this).text();
    $(this).replaceWith('<input id="campaignInputTitle" type="text" value="' + title + '">');
    console.log(title);

});

$('body').on('keypress','#campaignInputTitle',function(e) {
        if(e.which == 13) {
            var newTitle = $(this).val();
            $(this).replaceWith('<span id="campaignEditTitle">' + newTitle + '<small><span class="ss-write"></span></small>');
        }
});

$('body').on('blur','#campaignInputTitle', function(){
        var newTitle = $(this).val();
        $(this).replaceWith('<span id="campaignEditTitle">' + newTitle + '<small><span class="ss-write"></span></small>');
});  

$（'body'）。在（'click'，'campaignEditTitle'，函数（）上{
var title=$（this.text（）；
$（此）。替换为（“”）；
控制台日志（标题）；
});
$（'body'）。在（'keypress'，'#activationInputTitle'，函数（e）上{
如果（e.which==13）{
var newTitle=$（this.val（）；
$（this）.替换为（“”+newTitle+“”）；
}
});
$（'body'）。在（'blur'、'{
var newTitle=$（this.val（）；
$（this）.替换为（“”+newTitle+“”）；
});  
@AdrianEnriquez:很高兴能帮上忙：）@AdrianEnriquez:很高兴能帮上忙：）