如何使用JavaScript在textarea内逐行打印数组元素？

Question

我在数组中有一个数据集，我检查了哪些数据满足给定的日期范围，然后我需要逐行打印textarea中的数据集。

我的代码：

document.write('<div id="div1">'); 
    document.write('<b>Start date and time : </b><input type="date" id="start_date"/>  <input type="time" id="start_time"/></br></br>');
    document.write('<b>End date and time    : </b><input type="date" id="end_date"/>  <input type="time" id="end_time"/></br></br>');
    document.write('<button id="Load_button"  > Load</button>'); 
document.write('</div>'); 



document.write('<form action="player.html" id="frm1" method="get">');
    document.write('<textarea id="area" style="border: 1px; width: 100%; height=50% ">blah blah blah....</textarea>');
    document.write('<input type="submit" value="Filter">');
document.write('</form>');

document.getElementById('Load_button').addEventListener('click', function(event){
event.preventDefault();
   var date1 = Date.parse(document.getElementById('start_date').value);
   var time1 = (document.getElementById('start_time').value);
   var date2 = Date.parse(document.getElementById('end_date').value);
   var time2 = document.getElementById('end_time').value;

   var new_arr = [];
   var date_finder =/\d\d\d\d-\d\d-\d\d/;
   var time_finder =/\d\d:\d\d/ ;   
   document.getElementById('area').value = "" ;

   for(var i=0 ; i<arr.length ; i++){
        var date = Date.parse(date_finder.exec(arr[i]));
        var time = time_finder.exec(arr[i]);

        if (date <= date2 && date >= date1) {
            new_arr[i] = arr[i];
        }

    document.getElementById('area').value = document.getElementById('area').value +  document.write('<input type="checkbox" name="lines" value=" ' + i+' ">' + new_arr[i]+ '<br />');   
    }

});

输出窗口：

如何使用html和javaScript解决这个问题？我无法理解打印的原因是什么＆＃34; undefined＆＃34;以及如何在textarea内逐行打印结果集。请给我一个帮助。 - 谢谢 -