How to access input elements which were created by jQuery

Question

I want to create an upload form, which always presents a new file input, when filled out. I tried to make this work by creating new inputs but it just works once.

Here is the code:

<head><script type="text/javascript" src="jquery-1.7.2.min.js"></script></head>
<body><form>
  <div id="to"></div>
  ---
  <div id="from"><input type="file" class="new"></div>
</form>
<script type="text/javascript">
  $('.new').change(function() {
    $('.new').appendTo('#to').removeClass('new');
    $('#from').append('<input type="file" class="new">');
  });
</script>
</body>

try this $('#from').append('.attr('type','file')class="new">'); — pranky64, May 08 '12 at 06:38

score 1 · Answer 1 · answered May 08 '12 at 06:37

1

<script type="text/javascript">
  $('.new').on('change',function() {
    $('.new').appendTo('#to').removeClass('new');
    $('#from').append('<input type="file" class="new">');
  });
</script>

use on

answered May 08 '12 at 06:37

arun

3,637
3
28
54

+1 This will definitely work..if we use the latest jquery library – coolguy May 08 '12 at 08:09

score 1 · Accepted Answer · answered May 08 '12 at 06:37

1

<script type="text/javascript">
  $('.new').live('change',function() {
    $('.new').appendTo('#to').removeClass('new');
    $('#from').append('<input type="file" class="new">');
  });
</script>

answered May 08 '12 at 06:37

coolguy

7,728
9
43
71

Use of the .live() method is no longer recommended since later versions of jQuery offer better methods that do not have its drawbacks. – arun May 08 '12 at 06:40
http://stackoverflow.com/questions/8042576/whats-the-difference-between-jquery-live-and-on – arun May 08 '12 at 06:41
Try updating your jquery library – coolguy May 08 '12 at 07:24

Tats_innit · Answer 3 · 2017-08-21T01:38:05.810

0

HIya 2 working demos for you : http://jsfiddle.net/UxyMw/ or http://jsfiddle.net/UxyMw/1/

both works fine:

code:

$('.new').on("change",function() {
    $('.new').appendTo('#to').removeClass('new');
    $('#from').append('<input type="file" class="new">');
  });

edited Aug 21 '17 at 01:38

answered May 08 '12 at 06:39

Tats_innit

33,645
9
68
76

score 0 · Answer 4 · answered May 08 '12 at 06:43

0

try this http://jsfiddle.net/UxyMw/3/

answered May 08 '12 at 06:43

pranky64

427
3
18

How to access input elements which were created by jQuery

4 Answers4