Show all jquery results
I slowly and shakily created code that loops and displays a list of several results. I know it works because if I use document.write in the script, it shows all the results. However, when I try to get it to display in a html textarea, only the last result is display. How can I get them all to display in the html?
----------------------------
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> <!-- changed from 1.4.2 -->
<script type="text/javascript">
$(document).ready(function() {
$.getJSON('http://api.serviceu.com/rest/events/occurrences?nextDays=60&orgkey=xxxx&format=json&callback=?',
function(data){
var i=0;
do
{
dateday = new Date (data[i].ResourceStartTime.substr(0,10));
day = dateday.getDay(); //returns the day number - ie. Monday = 1
//turns day number into the day of the week
if (day==1) {dayweek="Monday";}
else if (day==2) {dayweek="Tuesday";}
else if (day==3) {dayweek="Wednesday";}
else if (day==4) {dayweek="Thursday";}
else if (day==5) {dayweek="Friday";}
else if (day==6) {dayweek="Saturday";}
else {dayweek="Sunday";}
//--------------------------//
datetext = data[i].ResourceStartTime.substr(0,2); //returns the number of the month
if (datetext==01) {monthtext="January";}
else if (datetext==02) {monthtext="February";}
else if (datetext==03) {monthtext="March";}
else if (datetext==04) {monthtext="April";}
else if (datetext==05) {monthtext="May";}
else if (datetext==06) {monthtext="June";}
else if (datetext==07) {monthtext="July";}
else if (datetext==08) {monthtext="August";}
else if (datetext==09) {monthtext="September";}
else if (datetext==10) {monthtext="October";}
else if (datetext==11) {monthtext="November";}
else {monthtext="December";}
//--------------------------//
$('.column1').text(data[i].ResourceStartTime.substr(3,2).replace("01","1").replace("02","2").replace("03","3").replace("04","4").replace("05","5").replace("06","6").replace("07","7").replace("08","8").replace("09","9") + "\r" + monthtext + "\r" ) ;
$('.result').text(data[i].ExternalEventUrl + data[i].Name + "\r" + dayweek + ", " + data[i].ResourceStartTime.substr(11,5).replace("01:","1:").replace("02:","2:").replace("03:","3:").replace("04:","4:").replace("05:","5:").replace("06:","6:").replace("07:","7:").replace("08:","8:").replace("09:","9:") + data[i].ResourceStartTime.substr(20,2).toLowerCase() + "\r" + data[i].Description + "\r") ;
i++;
}
while (i<520);
});
});
</script>
--------------------------------
html code
<div style="width:100px;float:left;">
<TEXTAREA cols="100" rows="10" class="column1" id="textArea1" type="textarea" >
</TEXTAREA>
</div>
<div style="width:600px;float:left;" >
<TEXTAREA cols="90" rows="10" class="result" id="textArea2" type="textarea" >
</TEXTAREA>
</div>
<div style="clear:both"></div>