Как вставить в динамически сгенерированный div скрипт для генерации div-ов новых

[xax]

Здравствуйте!
Не только не пониманию ни чего в jquery, но и вообще в каком бы то ни было программировании не смыслю ни чего. Но. Вследствие изучения ряда постов, в том числе и из вашего форума, накропал небольшой код для сайта, который обрабатывает значение для поля input, генерируя заданное количество div-вов с определенным содержанием, в котором ID для форм определяются динамически. Далее. В дополнение к имеющемуся содержанию нужно добавить скрипт (внутрь вновь генерируемого html), который внутри сгенерированных блоков точно так же позволял бы, в зависимости от значения вновь сгенерированного внутри div-а поля input, генерировать новые блоки в нужном количестве.
Иначе говоря, хочу в существующий код вставить код который точно также как существующий будет обрабатывать input с ID line-ob-is'+ [i+1] +' получаемый посредством обработки первого кода.
ЗЫ: Подозреваю, что то, что я пытаюсь делать - тупо по синтаксису не верно.
Подскажите - как прописывать?
Все выглядит примерно так (не ругайте за корявую подачу, я вообще не местный):

<div class="price-field-tx">
    <input type="number" id="line-ob" name="line-ob" value="0" min="0" max="100" />
</div>
<div class="price-text">
    <label for="line-ob">Бла бла бла</label>
</div>
<div id="line-ob-container">
</div>

$("#line-ob").change(function(){
   var kolloinput = $("#line-ob").val(),
   kollo = $("#line-ob-container > .price-range").length;
   if (kolloinput <= 100 && kolloinput > kollo) {
       for (i = kollo; i < kolloinput; i++) { 
           var loDiv = document.createElement("div");
           $(loDiv).addClass("price-range");
           $(loDiv).html('<div class="price-field-tx"><input type="number" id="line-ob-is'+ [i+1] +'" name="line-ob-is'+ [i+1] +'" value="0"  min="0" /></div><div class="price-text"><label for="line-ob-is'+ [i+1] +'">Бла бла бла выберите бла бла бла</label></div>  !!!!СЮДА ХОЧУ ВСТАВИТЬ СКРИПТ ПРАКТИЧЕСКИ ТАКОЙ ЖЕ КАК ВНЕШНИЙ!!!  ');
           $("#line-ob-container").append(loDiv);
       }
   }
   else {
       if (kolloinput <= 100) {
           for (i = kolloinput; i < kollo; i++) {
               $("#line-ob-container > .price-range").last().detach()
           }
         }
    }
});

[xax]

Подскажите, как вообще вставлять скрипт в $(loDiv).html('..... '); ?
Не $(loDiv).html('<script>....</script>'); же. Следует ли как либо изменять текст вставляемого скрипта (экранировать какие-либо символы и тд.)?

И как вставляемый скрипт заставить работать для динамического ID line-ob-is'+ [i+1] +'. Как правильно записать его?

[Alex_63]

xax,

$(loDiv).append('<script>//...тут скрипт<\/script>');

В одну строку, или так - для многострочного скрипта

var i=0;//к примеру

var script = function(){/*==|==;
  <script>
    alert("Тест");
    var n = #$1#;
  <\/script>

==|==;*/};
 script = script.toString().split('==|==;')[1].replace(/<\\\/script/gim,'</'+'script');//заменить #$1# на i+1: .replace('#$1#',i+1)
$(script).appendTo(loDiv);

[рони]

xax,
скрипт не надо дублировать, достаточно написать его правильно почитав про делегировние в js и on в jQuery.

[Alex_63]

рони,
++

xax,

$("#line-ob").on("change", function() { //обработчик on ставит события и на элементы, появившиеся после его установки
   var kolloinput = $("#line-ob").val(),
       kollo = $("#line-ob-container > .price-range").length;
   if (kolloinput <= 100 && kolloinput > kollo) {
       for (i = kollo; i < kolloinput; i++) { 
           var loDiv = $("<div/>").addClass("price-range");
           $(loDiv).html('<div class="price-field-tx"><input type="number" id="line-ob-is'+(i+1)+'" name="line-ob-is'+(i+1)+'" value="0" min="0"/></div><div class="price-text"><label for="line-ob-is'+(i+1)+'">Бла бла бла выберите бла бла бла</label></div>');
           $("#line-ob-container").append(loDiv);
       }
   } else {
       if (kolloinput <= 100) {
           for (i = kolloinput; i < kollo; i++) {
               $("#line-ob-container > .price-range").last().remove()
           }
       }
   }
});

[xax]

Сасибо, рони и Alex_63!
Мне даже кажется, еще немного - и я начну что-то понимать )).
Не совсем понял, скрипт, заданный для инупта c ID line-ob, в этом случае будет работать и для создаваемых инпутов с динамическими ID?

[Alex_63]

xax,
Тогда чуть иначе указывать селектор:

$("input[id^='line-ob']").on("change", function() { //обработчик on ставит события и на элементы, появившиеся после его установки
   var kolloinput = $("#line-ob").val(),
       kollo = $("#line-ob-container > .price-range").length;
   if (kolloinput <= 100 && kolloinput > kollo) {
       for (i = kollo; i < kolloinput; i++) { 
           var loDiv = $("<div/>").addClass("price-range");
           $(loDiv).html('<div class="price-field-tx"><input type="number" id="line-ob-is'+(i+1)+'" name="line-ob-is'+(i+1)+'" value="0" min="0"/></div><div class="price-text"><label for="line-ob-is'+(i+1)+'">Бла бла бла выберите бла бла бла</label></div>');
           $("#line-ob-container").append(loDiv);
       }
   } else {
       if (kolloinput <= 100) {
           for (i = kolloinput; i < kollo; i++) {
               $("#line-ob-container > .price-range").last().remove()
           }
       }
   }
});