how to get textarea value on modal (BOOTSTRAP)

how to get textarea value on modal (BOOTSTRAP)

function getMsgList(){
var table = "<tr class='vps_list_head'><th
width='20%'>Date</th><th width='70%'>Title List</th> <th
width='10%'></th></tr>";
for (i=0; i<msgdetail.length; i++){
table += "<tr id='list"+i+"' class='vps_list' >"
+"<td class='vps_col' href='#myModal"+i+"'
role='button'
data-toggle='modal'>"+(msgdetail[i][1]).substring(0,10)+"</td>"
+"<td href='#myModal"+i+"' role='button'
data-toggle='modal'>"+msgdetail[i][4]+"</td>"
+"<td><i class='icon-remove'
onclick='delMessage("+msgdetail[i][0]+")'></i></td></tr>"
+"<div id='myModal"+i+"' class='modal hide fade'
tabindex='-1' role='dialog'
aria-labelledby='myModalLabel'
aria-hidden='true'>"
+"<div class='modal-header'>"
+" <button type='button' class='close'
data-dismiss='modal'
aria-hidden='true'>×</button>"
+" <h4 id='myModalLabel'>Title:
"+msgdetail[i][4]+"</h4>"
+"From : "+msgdetail[i][2]
+"<br>Date : "+(msgdetail[i][1]).substring(0,10)
+"</div>"
+"<div class='modal-body'>"
+""+msgdetail[i][5]+""
+"</div>"
+"<div class='modal-footer'>"
+"<div align='center'><textarea name='detail'
id='detail' style='margin: 0px 0px 30px 0px;
width: 500px; height:
81px;'></textarea></div>"//This is ploblem.
+" <button class='btn btn-primary'
onclick='replyMessage("+msgdetail[i][0]+")'>Reply</button>"
+" <button class='btn' data-dismiss='modal'
aria-hidden='true'>Close</button>"
+"</div>"
+"</div>"
}
document.getElementById('data_msg_order').innerHTML = table;
}
function replyMessage(i){
var rep = document.getElementById("detail").value;
alert(rep);
}
How to get value from modal Help me pls.
i try to fix it by use
document.getElementById("modal").getElementById("detail")
but still error.