javascript - 動的に追加されたコントロールで LiveValidation を使用する

Question

LiveValidation JavaScript ライブラリを使用して動的に追加されるフォーム コントロールでクライアント側の検証を実行しようとしています。

コントロールと検証コードが最初からある場合は正常に機能しますが、動的に追加されたコントロールでは機能しません。

静的制御と検証 (正常に動作)

<!-- the container where the dynamic javascript code manipulates -->
                <div id = "FileUploadContainer">
                    <!--FileUpload Controls will be added here -->
                    <input id="file0" name = "file" type="file" class ="size4"/>
                    <script type="text/javascript">
                        var file0 = new LiveValidation('file0', { wait: 500 });
                        file0.add(Validate.Presence, { failureMessage: "File is required." });
                    </script>
                    <input id="textbox0" name = "txtShotNo" type="text" placeholder="Shot #" class="size1"/>
                    <script type="text/javascript">
                        var textbox0 = new LiveValidation('textbox0', { wait: 500 });
                        textbox0.add(Validate.Presence, { failureMessage: "Shot number is required." });
                        textbox0.add(Validate.Numericality, { onlyInteger: true, minimum: 1, maximum: 10000 });
                    </script>
                </div>

動的に追加されたコントロールと検証 (機能しません)

<script type = "text/javascript">
    var counter = 1;
    function AddFileUpload() {
        var div = document.createElement('DIV');
        div.innerHTML = '<input id="file' + counter + '" name = "file" type="file" class="size4" />' +
                        '<script type="text/javascript">' +
                        '   var file' + counter + ' = new LiveValidation(\'file' + counter + '\', { wait: 500 });' +
                        '   file' + counter + '.add(Validate.Presence, { failureMessage: "File is required." });' +
                        '<\/script>' +
                        '<input id="textbox' + counter + '" name = "txtShotNo" type="textbox" placeholder="Shot #" class="size1" />' +
                        '<script type="text/javascript">' +
                        '    var textbox' + counter + ' = new LiveValidation(\'textbox' + counter + '\', { wait: 500 });' +
                        '    textbox' + counter + '.add(Validate.Presence, { failureMessage: "Shot number is required." });' +
                        '    textbox' + counter + '.add(Validate.Numericality, { onlyInteger: true, minimum: 1, maximum: 10000 });' +
                        '<\/script>' +
                        '<input id="Button' + counter + '" type="button" value="Remove" onclick = "RemoveFileUpload(this)" class="primary" />';
        document.getElementById("FileUploadContainer").appendChild(div);
        counter++;
    }
    function RemoveFileUpload(div) {
        document.getElementById("FileUploadContainer").removeChild(div.parentNode);
    }
    </script>

動的に追加されたコントロールに対して検証を機能させる方法について、誰かがいくつかの指針を持っていますか?