jQuery के साथ Html.DropDownListFor() का उपयोग करना (ड्रॉप डाउन सूची वाली एक और पंक्ति जोड़ना)

मैं jQuery के साथ Html.DropDownListFor() का उपयोग करने में समस्या का सामना कर रहा हूं। मैं ASP.NET MVC 2, C#, .NET 4 और jQuery 1.4.2 का उपयोग कर रहा हूं।

मुझे जो त्रुटि मिल रही है वह है 'अनकॉट सिंटेक्स एरर: अनपेक्षित टोकन ILLEGAL' (इसे क्रोम के डेवलपर टूल्स का उपयोग करके कंसोल में देखना)।

मैं इस मुद्दे का निर्माण करूंगा:

नियंत्रक में मेरी चयनसूची का सेटअप यहां दिया गया है:

            var Additives = new SelectList(
            new[]
            {
                new { Value = 1, Name = "FCS" },
                new { Value = 2, Name = "Fungizone" },
                new { Value = 3, Name = "HEPES" },
                new { Value = 4, Name = "Investigator supplied" },
                new { Value = 5, Name = "L-Glutamine" },
                new { Value = 6, Name = "None" },
                new { Value = 7, Name = "Pen Only" },
                new { Value = 8, Name = "Pen/Strep" },
                new { Value = 9, Name = "Pen/Strep/Antibiotic" },
                new { Value = 10, Name = "Strep Only" }
            }
            , "Value", "Name");

        ViewData["additives"] = Additives;

यहाँ पर मैं इस SelectList का उपयोग एक दृश्य में एक अन्य योगात्मक पंक्ति जोड़ने के लिए एक बटन के साथ करता हूँ:

            <div id="freshAdditive">
                <%: Html.Label("--Additives--")%><br />
                <%: Html.DropDownListFor(model => model.freshAdditive[0], (SelectList) ViewData["additives"], string.Empty)%>
                <%: Html.TextBoxFor(model => model.freshAdditiveAmount[0])%>
                <input id="moreAdditive" class="buttoncenter" value="More Additive" type="button" />
            </div>

यहां मैं jQuery के साथ Html.DropDownListFor का उपयोग करने का प्रयास कर रहा हूं, यह वह जगह है जहां मैं jQuery का उपयोग करके एक और योगात्मक पंक्ति जोड़ने का प्रयास कर रहा हूं:

    <script type="text/javascript">
    // Add additional additive
    $("#moreAdditive").click(function () {
        //alert("More Additive");
        var insertCode = '<br />'
            + '<%: Html.DropDownListFor(model => model.freshAdditive[1],  (SelectList) ViewData["additives"], string.Empty) %>'
            + '<%: Html.TextBoxFor(model => model.freshAdditiveAmount[1])%>'
        $('#freshAdditive').append(insertCode);
    });
</script>

(जानबूझकर 1 के हार्ड-कोडेड तत्व का उपयोग करना ... मूल बातें काम करने के बाद मैं रिफैक्टर करूंगा!) अगर मैं Html.DropDownListFor() वाली लाइन पर टिप्पणी करता हूं, तो Html.TextBoxFor() सहायक ठीक काम करता प्रतीत होता है jQuery के साथ। मुझे लगता है कि इसमें मल्टी-लाइन स्ट्रिंग्स के साथ कुछ करना है, लेकिन इसे jQuery में संभालने का कोई तरीका नहीं मिला है। मुझे कुछ यहां मिला, लेकिन मैं असमर्थ हूं इसे काम करने के लिए।

ऐसा लगता है कि यह सीधे आगे होना चाहिए, लेकिन मुझे कई सुझाव नहीं मिल रहे हैं। कोई विचार?

धन्यवाद!