title: change drop-down options based on another drop-down option in Dynamic list
body: <p>I'm trying to change drop down values of Establishment from drop down city. The rows are added dynamically. How can i change selectE1 using selectC1  </p>
  
  <pre><code>&lt;script&gt;
      var olList = $('#olcityList');
  
      var $li = $('li.list').clone();
  
  
      // Addding a new list element to the list
      $('#plus').click(function(){ 
          var index = olList.find('li').length+1;
  
          //Create clone to manipulate its elements
          var li = $li.clone();
          li.attr('id',  index);
          li.find('.city select').attr('id', 'selectC' + index);
          li.find('.esta select').attr('id', 'selectE' + index);
  
          olList.append(li);
      });
  
      // Get the selectC id when changed 
      $('select').change(function(){
  
      console.log("parent id: " + $(this).closest('li').attr('id'));
      console.log("Current id: " + $(this).attr('id'));
  
      // To manipulate SelectE id 
      var tempParentId= $(this).closest('li').attr('id');
      console.log( $('#estaList'+tempParentId).val()   );
  
  });
  &lt;/script&gt;
  
  &lt;!-- language: lang-html --&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  
  &lt;ol id="olcityList"&gt;
          &lt;li class="list" id="1"&gt;
              &lt;div class="city"&gt;
                  &lt;select id="selectC1"&gt;
                      &lt;option value=1&gt;Delhi&lt;/option&gt;
                      &lt;option value=2&gt;Mumbai&lt;/option&gt;
                  &lt;/select&gt;
              &lt;/div&gt;
  
              &lt;div class="esta"&gt;
                  &lt;select id="selectE1"&gt;
                      &lt;option value="1"&gt;Delhi 1&lt;/option&gt;
                      &lt;option value="1"&gt;Delhi 2&lt;/option&gt;
                      &lt;option value="2"&gt;Mumbai 2 &lt;/option&gt;
                      &lt;option value="2"&gt;Mumbai 1&lt;/option&gt;
                  &lt;/select&gt;
              &lt;/div&gt;
          &lt;/li&gt;
  &lt;/ol&gt;
  </code></pre>
  
  <p>Populating the dropdown text and values using jsp.
  However select doesn't work work after once. </p>
  
  <p>Using this as a refrence<br>
  <a href="https://stackoverflow.com/questions/10570904/use-jquery-to-change-a-second-select-list-based-on-the-first-select-list-option">Use jQuery to change a second select list based on the first select list option</a></p>