title: Dynamically populate the drop-down using jQuery in ASP.Net MVC3
body: <p>I have two models:</p>
  
  <pre><code>public class ProfessorModels
  {
      public string FullName { get; set; }
      public int ID { get; set; }
  }
  </code></pre>
  
  <p>and</p>
  
  <pre><code>public class ClassModels
  {
      public int ID { get; set; }
      public string Professor { get; set; }
      public decimal Name { get; set; }
  }
  </code></pre>
  
  <p>in my View there is a form to add the class:</p>
  
  <pre><code>@model MvcApp.Models.ClassModels
  
  @{
      ViewBag.Title = "Create";
  }
  
  &lt;h2&gt;Create&lt;/h2&gt;
  
  &lt;script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"&gt;&lt;/script&gt;
  
  @using (Html.BeginForm()) {
      @Html.ValidationSummary(true)
      &lt;fieldset&gt;
          &lt;legend&gt;ClassModels&lt;/legend&gt;
  
          &lt;div class="editor-label"&gt;
              @Html.LabelFor(model =&gt; model.Name)
          &lt;/div&gt;
          &lt;div class="editor-field"&gt;
              @Html.EditorFor(model =&gt; model.Name)
              @Html.ValidationMessageFor(model =&gt; model.Name)
          &lt;/div&gt;
  
          &lt;p&gt;
              &lt;input type="submit" value="Create" /&gt;
          &lt;/p&gt;
      &lt;/fieldset&gt;
  }
  
  &lt;div&gt;
      @Html.ActionLink("Back to List", "Index")
  &lt;/div&gt;
  </code></pre>
  
  <p>I would like to add a drop-down menu to the Class View, which lists all the available professors. Professors are in db, and I can easily make a call to db from controller and load all professors in to some list/array.
  I need help with how to populate the drop-down with professors using <strong>jQuery</strong>.</p>