Question

Is there any way to generate any html element on run time?

Let’s say, I have a text field for user to enter any number.
Requirements:
1. If user enters 10, then it should generate 10 IMG element tags.
2. We can also manipulate the value of IMG src
3. Each 10 output should be something like img src=”path chosen” etc, <–Dynamically generated

Any idea/suggestions?

Answer 1

Example with jQuery:

HTML:

<input type="text" id="my-input" value="0" />
<div id="container"></div>

JS:

$('#my-input').change(function() {
  var el = $(this);
  for (var i=0; i < parseInt(el.val(), 10); i++) {
    $('#container').append('<img src="blabla" />');
  }
});