title: How to create MultiLevel Dynamic dropdown using jquery
body: <p>I am trying to create Multilevel Dropdown.</p>
  
  <p>I have default dropdown with values</p>
  
  <p>Ex. Parent Dropdown with Id='ddl1'</p>
  
  <p>If we select value from it then load data from server with selected and Create new dropdown name as child dropdown, and again select value from child and load data from server, if data present then create child dropdown.</p>
  
  <p>we have to create drowpdown, till n level.</p>
  
  <p>'Ex. i am creating like below'</p>
  
  <pre><code>function createdropdown(id) {
  
   var labelHtml = "&lt;tr id='trFormType" + id + "' class='trFormType'&gt;&lt;td&gt;&lt;label class='tdLabel'&gt;" + labelFormType + " * &lt;/label&gt;&lt;/td&gt;";
   labelHtml += "&lt;td&gt;&lt;select class='ddlFormType' id='ddlFormType" + id + "' name='ddlFormType" + id + "'  &gt;";
      labelHtml  += "&lt;option value=''";
      labelHtml += "&gt;" + labelSelect + "&lt;/option&gt;";
      labelHtml += "&lt;/select&gt;&lt;/td&gt;&lt;/tr&gt;";
  
      return labelHtml;
  }
  </code></pre>
  
  <p>var selectedId='';    $(".ddlFormType").live("click", function () {    selectedId= "#" + $(this).prop('id');    });</p>
  
  <p>$(selectedId).live("change", function () {       $.ajax({    url: Url + 'Method/' +     (selectedId).val(),    type: 'GET',    dataType: 'json',    cache: false,             timeout: 9000,    success: function (data) {    $("#detailTable tbody").append(createdropdown(currentId));    }
  });</p>
  
  <p>'But .change event not get fired, for dyncamically created dropdown'</p>
  
  <p>'Hope you can understand?'</p>