How to show data from ajax call in partial view mvc

See more:

ASP.NET

Ajax

MVC

jQuery

Hi
When I click on the first dropdown it finds the children for that category, but the values is showing in plain text and not in my partial views dropdown. What am I doing wrong??

I want to make cascading dropdowns with the partial view, so when I click on the dropdown list it will automatic fill the dropdown list with the children of that category. But I am a little bit stuck on this one.

I am really new on this one.

This is my code that I have been trying.
My Controller :

[HttpGet]
        public JsonResult CategoryList(int catId)
        {
            var subcategories = (from s in db.Categories where s.ParentCategoryId == catId select new SelectListItem {
                Text = s.Name, Value = s.ParentCategoryId.ToString()
            });
    
                return Json(subcategories, JsonRequestBehavior.AllowGet);   
        }

My partial view :

@model ASPNetMarketplace.Models.Listing

        @Html.DropDownList("dynamicContent", new SelectList(string.Empty, "Value", "Text"), "Please select a Subcategory", new { @class = "form-control" })

My Indexview :

@Html.DropDownList("CategoryId", ViewBag.CategoryId as SelectList, "Select a Category", new { id = "CategoryId", @class = "form-control" })<br />

                    <div id="dynamicContent">
                    @{
                        Html.RenderPartial("DropDownList", Model);
                    }
                </div>

The script on the indexview :

<script>
    //Run Jquery script
    jQuery(document).ready(function ($) {
       //Dropdownlist Selectedchange event
        $("#CategoryId").change(function () {
            //Take the Id from the dropdown list when selected an item
            var id = $(this).val()           
            //Send the information to the controller
            $.ajax({
                type: 'GET',
                url: '@Url.Action("CategoryList", "Manage")', // we are calling json method
                data: { catId: id },               
                //here we are get value of selected item and passing same value
                // to input to the json method CategoryList.
                success: function (data) {

                    $.each(data, function (id, data) {                    (($('#dynamicContent').html($('<option></option>').val(data.Value).html(data.Text));
                    });                  
                }
            });
        });
    });  
</script>