javascript - div に読み込まれたページを削除する

Question

div 内に他のページをロードするページがあります。

$(document).ready(function() {
    $(document).on("click", ".animalFinder", function()
    { 
    var $inputElement = $(this),
            inputName = $inputElement.attr("name");

    $("#freeload").show();
    $("#freeload").load("animaldetails.php?anmalid="+inputName);
    });
  });

読み込まれるページには、動物に関する情報と、動物の鳴き声が何であるかをユーザーに警告するスクリプトが含まれています。

$(document).on("click", "input.noisebutton", function() {   
    var answer = confirm("Want to play noise?")
    if (answer){             
             var $inputElements = $(this),
            inputNames = $inputElements.attr("name");
        alert(inputNames);
    }
    else{
        return false;   
    }
});

動物とその鳴き声は、データベースから読み込まれるときに名前フィールドに追加されるため、さまざまな動物のページを動的に作成できます。

問題は、最初の動物ページを読み込んだ後、ページから削除する方法がありません。これは問題ありませんが、動物の詳細ページに保持されているスクリプトが再度作成され、動物のノイズ ボタンをクリックしたときに発生します。 div にロードされた次の動物は、スクリプトのインスタンスが 2 つあるため、スクリプトを 2 回実行します。

スクリプトは非常に軽量で、その 1 つのインスタンスでのみ使用されるため、スクリプトを動物ページに保持したいと思います。これにより、動物の詳細ページは他のページに比べて頻繁に使用されないため、残りの部分がより効率的になりますが、メソッドが必要です。新しいスクリプトが押されたときにスクリプトまたはページ全体のいずれかを削除します。

質問が明確であることを願っています