html()でscriptタグを書き換えた際、書き換え前の処理が走らないようにしたい

ajaxでhtmlを受け取り、受け取ったhtmlでbody要素内を書き換えたいと考えています。

ajaxでの通信が成功した際の処理は、以下のようにしています。

$.ajax({
 ・・・
}).done(function(data, status, jqXHR){
   var response = $(jqXHR.responseText);
   for (var i = 0; i < response.length; i++) {
       if (response[i].id === 'content') {
          $('body').html(response[i].outerHTML);
          return;
       }
   }
})

この時、body要素内にあるscript要素も書き換えられています。
書き換える前のscript要素では

<script type="text/javascript">
  $(window).on('resize', function () {
      TestMethod();
  });
</script>

というように、windowのリサイズイベントの処理を記述しています。
書き換え後のscript要素には、この処理はありません。

htmlの書き換え完了後、ブラウザの幅を変えて、リサイズイベントを発生させると、
書き換え前の処理が走ってしまいます。
なぜ書き換え前の処理が走ってしまうのでしょうか？
書き換え前の処理を走らせないようにするには、どうすればよいでしょうか？

行動規範の内容に同意します

回答1件

ベストアンサー

書き換える直前にイベントを削除すれば良いような。

JavaScript
1$( '*' ).off();
2```**動くサンプル：**[https://jsfiddle.net/t7fxzemb/](https://jsfiddle.net/t7fxzemb/)
3
4---
5
6【.off() | jQuery API Documentation】
7[http://api.jquery.com/off/](http://api.jquery.com/off/)
8
9【jQueryで登録済みイベントハンドラを一覧する方法 - それマグで！】
10[http://takuya-1st.hatenablog.jp/entry/2014/04/05/042658](http://takuya-1st.hatenablog.jp/entry/2014/04/05/042658)