title: Make the option available if i click the remove button
body: <p>I am facing the problem that if I click on "remove" my selectbox should disappear as well as my option that I have selected in the select box should be available in next select box again. Right now if I click on remove it is disappearing but the option doesn't seems to be available in other select fields. </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var uniqId = 1;
          var selectedOptionDataList = new Array();
          var jsonData = [
            {'name': 'A', 'value': 'A'},
              {'name': 'B', 'value': 'B'},
              {'name': 'C', 'value': 'C'},
              {'name': 'D', 'value': 'D'}
              
          ];
  
          function regenerateSelectbox(){
            $('select.dyn-select').each(function(){
                var _selector = $(this);
                  var _curVal = _selector.val();
                  
                  _selector.html(generateOption());
                  if(_curVal == ""){
                    _selector.append('&lt;option value="'+ _curVal +'"&gt;select&lt;/option&gt;');
                  }else{
                    _selector.append('&lt;option value="'+ _curVal +'"&gt;'+ _curVal +'&lt;/option&gt;');
                  }
                  _selector.val(_curVal);
              })
          }
  
          function checkOptionExistences(listOptionVal){
            var _found = false;
              
            $.each(selectedOptionDataList, function(inn, vnn){ 
                 if(vnn.selectboxoption == listOptionVal){
                   _found = true;
                  }
              });
              
              return _found;
          }
  
          function generateOption(){
            var optionArr = new Array();
              optionArr.push('&lt;option value=""&gt;select&lt;/option&gt;');
              
            $.each(jsonData, function(i, v){
                if(!checkOptionExistences(v.value)){
                 optionArr.push('&lt;option value="'+ v.value +'"&gt;'+ v.name +'&lt;/option&gt;');
                  }
              });
              
              return optionArr.join('\n');
          }
  
          function removeSelectedOptionFromList(param){
            var tmpArrList = selectedOptionDataList;
              selectedOptionDataList = new Array();
              
              $.each(tmpArrList, function(i, v){
                if(param.selectboxid != v.selectboxid){
                    selectedOptionDataList.push({'selectboxid':v.selectboxid, 'selectboxoption':v.selectboxoption});
                  }
              });
          }
  
          function selectedOptionList(param){
            var _found = false;
            $.each(selectedOptionDataList, function(i, v){
                if(param.selectboxid == v.selectboxid){
                    _found = true;
                    v.selectboxoption = param.selectboxoption;
                  }
              });
              
              if(!_found){
              selectedOptionDataList.push({'selectboxid':param.selectboxid, 'selectboxoption':param.selectboxoption});
              }
          }
  
          $('#btn-create').click(function(){
            if(selectedOptionDataList.length == jsonData.length){
                alert('No data available');
              }else{
             $('div#selectField-wrapper').append('&lt;div&gt;&lt;a class="remove_field"&gt;remove&lt;/a&gt;&lt;select class="dyn-select" id="select-'+ uniqId +'"&gt;'+ generateOption() +'&lt;/select&gt;&lt;div&gt;&lt;br&gt;');
               uniqId++;
              }
          });
  
          $(document).on('change', 'select.dyn-select', function(){
            var _selector = $(this);
            if(_selector.val() == ""){
                removeSelectedOptionFromList({'selectboxid':_selector.attr('id')});
              }else{
                selectedOptionList({'selectboxid':_selector.attr('id'), 'selectboxoption':_selector.val()});
              }
              
              regenerateSelectbox();
          });
          
          $('#dropdown-wrapper').on('click', ".remove_field", function(e) {
              e.preventDefault();
              $(this).parent('div').remove();
              x--;
            });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;div id="dropdown-wrapper" class="row"&gt;
  
     &lt;div class="col-md-3" id='selectField-wrapper'&gt;
     &lt;/div&gt;
     
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>