Get Table Data Into TextBox/TextArea

HTML

<h1>Get Table Data Into TextBox/TextArea</h1>

<hr>
<table id="TableCSS">
    <thead>
        <tr>
            <th>S.No</th>
            <th>FileName</th>
            <th>FileSize</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td value ="abc">1</td>
            <td>bootstrap.css</td>
            <td>118KB</td>
        </tr>
        <tr>
            <td>2</td>
            <td>bootstrap.min.css</td>
            <td>96KB</td>
        </tr>
        <tr>
            <td>3</td>
            <td>datepicker.css</td>
            <td>18KB</td>
        </tr>
        <tr>
            <td>4</td>
            <td>style.css</td>
            <td>123KB</td>
        </tr>
    </tbody>
</table>
<a href="#" id="getAll">Get All Data</a>
<br>
<textarea id="tarea" rows="4" cols="50"></textarea>

CSS

body{font-family: calibri;font-size: 12px;}
#getAll {background: #000;border: 1px solid #E02222;color: #fff;padding: 5px 15px;font-family: calibri;font-size: 12px;cursor: pointer;margin: 0 2px;display: inline-block;float: left;text-decoration: none;font-weight: bold;}
#getAll:hover {background: #E02222;border: 1px solid #000;}
table#TableCSS {border-collapse: collapse;font-family: calibri;font-size: 12px;}
table#TableCSS tr td,table tr th {padding: 4px 10px;border: 1px solid #D5D5D5;}
#tarea{display:block;height:120px;width:90%;}
h1{text-align:center;font-size:15px;}

JavaScript

//Get Table Data Into TextBox/TextArea
var table = document.getElementsByTagName("table")[0];
var tbody = table.getElementsByTagName("tbody")[0];
var textarea = document.getElementById('tarea');
$("#getAll").click(function () {
    $("#tarea").val("");
    var rowCount = tbody.rows.length;
    for (var i = 0; i < rowCount; i++) {
        var row = table.rows[i];
        for (var j=0; j < 3; j++){
        textarea.value += tbody.rows[i].cells[j].innerHTML+";";
        }
        textarea.value +="\n";
    }
    $("#tarea").val(textarea.value);

});