入力値から要素liを作成する

Question

値は<input type="number">です。値と同じ量のli要素を作成するにはどうすればよいですか？

たとえば、人数の入力があり、入力された人数が非常に多いli要素を作成する必要があります。

Answer 1

$(document).on('click','#create',function() { 
 
    var liNum = $('#liNum').val(); 
 
    if (liNum && !isNaN(liNum)) { 
 
    var ul = document.createElement('ul'); 
 
    for(var i = 0;i < liNum; i++) { 
 
     var li = document.createElement('li'); 
 
     li.innerHTML = "List item #" + i; 
 
     ul.appendChild(li); 
 
    } 
 
    document.body.appendChild(ul); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
<input id="liNum" type="number" /> 
 
<button id="create">Create list</button>