使用select显示多个div的JavaScript函数

我试图根据用户在“选择”下拉列表中选择的数字多次显示div

我有一个以前使用过的函数：

$(document).ready(function(){
var el = '<div class="form-group">' +
'<label for="Name" class="col-sm-4 control-label">Name:</label>' +
'<div class="col-sm-8 input">'+
    '<input type="text" class="form-control" id="Name" name="Name[]" placeholder="Enter name" value="" required="required">'+
'</div>' +
'</div>' ;

$('#numNames').on('change', function(e) {
  var numSelected = $(this).val();
  appendControls(numSelected);
});

function appendControls(num) {
  $('#elcontainer').empty();
  for (var i=0; i<Number(num); i++) {
     $('#elcontainer').append(el);
  } 
}
});

$（文档）.ready（函数（）{
变量el=''+
'姓名：'+
''+
''+
'' +
'' ;
$（'numNames'）。关于（'change'，函数（e）{
var numSelected=$（this.val（）；
附加控件（numSelected）；
});
函数附加控件（num）{
$（'#elcontainer'）.empty（）；
对于（var i=0；i

我已经尝试过用与上面相同的方法为这个div设置函数，但是我一直找不到一种方法来实现它

有没有什么方法可以让我这样做？或者有没有类似的方法可以让我这样做

<script>
function ChooseName(data) {
document.getElementById ("Name").value = data.value;
}
</script>

---

appendControls

正在被调用？我以前的做法是在select like“”下有一个div，这是有效的。我需要为这个div做一些不同的操作吗？“”它现在存在吗？它是必需的。是的，我在select语句下有这个div，但它不起作用

<script>
function ChooseName(data) {
document.getElementById ("Name").value = data.value;
}
</script>

function appendControls(num) {
  $('#elcontainer').empty();
  var el = $('.from-group:first').clone(true, true);
  for (var i=0; i<Number(num); i++) {
     $('#elcontainer').append(el);
  } 
}