Syntax error with jQuery added

Question

My code is as follows:

        <script>
        var i = 2;
        $("document").ready(function(){
            $("#newrow").click(function(){
                $("#maintable").append('<tr>
                                        <td><input type="text" name="dept_" + i size="5" maxlength="5" /></td>
                                        <td><input type="text" name="hours_" + i size="5" maxlength="1" /></td>
                                    </tr>');
            });
            i = i + 1;
        });
    </script>

Whenever I run it, JavaScript gives me "Uncaught SyntaxError: Unexpected Token ILLEGAL" in the line $ ("# maintable"). append.

In my life I cannot understand what a syntax error is.

This is not a problem with adding the actual item, because I just tried '<td></td>'and got the same error.

Answer 1

You cannot break a line in multiple lines without special handling. Either put it all on one line, or avoid newlines with backslashes:

'<tr>\
     <td><input type="text" name="dept_"' + i + ' size="5" maxlength="5" /></td>\
     <td><input type="text" name="hours_"' + i + ' size="5" maxlength="1" /></td>\
</tr>'

Answer 2

<script>
    var i = 2;
    $(document).ready(function(){
        $("#newrow").click(function(){
            var html = '<tr>';
                html += '<td><input type="text" name="dept_"'+i+' size="5" maxlength="5" /></td>';
                html += '<td><input type="text" name="hours_"'+i+' size="5" maxlength="1" /></td>';
                html += '</tr>'
            $("#maintable").append(html);
        });
        i++;
    });
</script>

, "" ! "i" ! , , - .