How to Add Horizontal line in Javascript

I would like to add a horizontal seperating line on a dynamic populated table. How do I do this? Below is a snippet.

    function addNewRow() {
    $('#displayTable tr:la开发者_JAVA百科st').after('<tr><td style="font-size:smaller;" class="dataField1"></td><td style="font-size:smaller;" class="dataField2"></td><td style="font-size:smaller;" class="dataField3"></td></tr>');
    var $tr = $('#displayTable tr:last');
        $tr.find('.dataField1').text($('#txtName').val());
        $tr.find('.dataField2').text($('#txtAddress').val());
        $tr.find('.dataField3').text('document.write("<tr><td colspan=\"2\"><hr \/><\/td><\/tr>");
    }

I would get rid of document.write. Instead of the

<hr>

you are using, put a "css class" that makes the table have a visible bottom border (line will be of course only as wide as the table itself). Something like

border-bottom: 1px solid black;

Prevent document.write at all times, like everywhere unless you know exactly what you're doing.

Evil thing. Give this a shot:

$('#displayTable tr:last').after('<tr><td style="font-size:smaller;" class="dataField1"></td><td style="font-size:smaller;" class="dataField2"></td><td style="font-size:smaller;" class="dataField3"></td></tr>');
var $tr = $('#displayTable tr:last');
    $tr.find('.dataField1').text($('#txtName').val());
    $tr.find('.dataField2').text($('#txtAddress').val());
    $tr.find('.dataField3').append("<tr><td colspan=\"2\"><hr/><\/td><\/tr>");