Adding a newline character to InnerText property of div
<p>I have a button click event that should take the text from a text box and then write to the <code>InnerText</code> property of a div on the same page.  The text is getting inputted to the div, but it's never on a new line.  I've tried the following variations: 
EDIT: To the person who chose to close this question, this is inside of a div and not inside a multi-line text box.  They don't work the same, because I had this working when I was using a multi-line text box.</p>

<pre><code>protected void Button1_Click(object sender, EventArgs e)
    {

        if (txtCategory.Text.Length &gt; 0)
        {
            StringBuilder sb = new StringBuilder(drugTerms.InnerText);
            sb.AppendLine(txtCategory.Text);
            drugTerms.InnerText = sb.ToString();
            txtCategory.Text = "";
        }

    }


 protected void Button1_Click(object sender, EventArgs e)
    {

        if (txtCategory.Text.Length &gt; 0)
        {
            StringBuilder sb = new StringBuilder(drugTerms.InnerText);
            sb.Append(txtCategory.Text).Append(Environment.NewLine);
            drugTerms.InnerText = sb.ToString();
            txtCategory.Text = "";
        }

    }
</code></pre>

<p>aspx</p>

<pre><code>&lt;%@ Page Language="C#" AutoEventWireup="true" Inherits="_Default" Codebehind="Default.aspx.cs" %&gt;

&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
&lt;head id="Head1" runat="server"&gt;
    &lt;title&gt;AutoComplete Text Box with jQuery&lt;/title&gt;
    &lt;link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css"
        rel="stylesheet" type="text/css" /&gt;
    &lt;link href="StyleSheet1.css" rel="stylesheet" type="text/css" /&gt;
    &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"&gt;&lt;/script&gt;
    &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"&gt;&lt;/script&gt;
    &lt;script type="text/javascript"&gt;
        $(document).ready(function () {
            SearchText();
        });
        function SearchText() {
            $(".auto").autocomplete({
                source: function (request, response) {
                    $.ajax({
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        url: "Default.aspx/GetAutoCompleteData",
                        data: "{'CategoryName':'" + document.getElementById('txtCategory').value + "'}",
                        dataType: "json",
                        success: function (data) {
                            response(data.d);
                        },
                        error: function (x) {
                            alert("Error Occurred");
                        }
                    });
                }
            });
        }
    &lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
    &lt;form id="form1" runat="server"&gt;
    &lt;div class="demo"&gt;
        &lt;div class="ui-widget"&gt;
            &lt;label for="tbAuto"&gt;
                Enter Drug&amp;nbsp; Name:
            &lt;/label&gt;
            &lt;asp:Button ID="Button2" runat="server" OnClick="Button1_Click" Text="Button 2" /&gt;
            &lt;asp:TextBox ID="txtCategory" CssClass="auto" runat="server"&gt;&lt;/asp:TextBox&gt;
            &lt;asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button 1" /&gt;
            &lt;div id="drugTerms" runat="server"&gt;&lt;/div&gt;




        &lt;/div&gt;
    &lt;/div&gt;



    &lt;/form&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>and I tried to add an html break line character in their as well.  Every time when the button is clicked the text in the text box is added with the new term being a space instead of the newline character.  Why can't I add a new line character in this div?</p>
