Html.raw（），不编译jQuery返回的代码

Question

我正在尝试在页面上设置彩色的 textarea 。 所以基本上我计划有一个 textarea 输入和一个<p>对象。当用户键入 textarea 时，只要用户在textarea中键入任何字母，<p>就会用 jQuery 更新。

类似于Stackoverflow。

用户输入完毕后，将从 textarea 中选择一个文本，然后单击红色或蓝色按钮。 系统将读取所选文本，找到起始文本的索引并追加

 <span> style='color:red;'> 

在文本末尾添加

 </span>

  

说实话，我不确定这是最好的方法。我见过   很多RichText编辑器，但是它们没有任何保存按钮。

无论如何。 到目前为止，我做了什么：

<div class="row">
<a href="#" name="BtnRed" id="BtnRed" class="btn btn-danger">Red</a>
<a href="#" name="BtnBlue" id="BtnBlue" class="btn btn-primary">Blue</a>

<form asp-action="Save" method="post">
    <textarea rows="10" style="width:100%" id="DetailText" name="DetailText">
        This email and any files whom this email is addressed. &lt;span&gt; style='color:red;'>This suppose to be red&lt;/span&gt;  
        Any unauthorised use, retention, distribution, copying or disclosure is strictly prohibited.
        If you have received this email in error)
    </textarea>
</form>
<hr />
@Html.Raw("<p id='viewText'></ p >");

<script src="~/lib/jquery/dist/jquery.js"></script>
 <script>

$(document).ready(function () {
    $("#viewText").text($("#DetailText").val());
    $("#DetailText").on('input',function () {
        $("#viewText").text(   $("#DetailText").val());
    });        
});

问题 Html.Raw（）不会填充文本，而是显示 HTML 代码。 style ='color：red;'>这应该是红色