javascript - Remove all divs (with specific class) except the div (having same class) parenting a dropdown with particular id -

1. i have code stating:

   $(".risk_main_div:not(#risk_1)").remove();

2. the div #risk_1 contains dropdown id fetched using concept:

   firstiddrop = $(".input_field.criteria_risk").first().attr('id');

3. since removal of #risk_1 done hard-codedly, want achieved this

   $(".risk_main_div:not([parent of firstiddrop])").remove();

can me in having correct code of doing so?

i couldn't figure out somehow.

html

its rough html this,

<div id="risk_1" class="risk_main_div">      <div id="risk_drp_cont_1">          <select id="risk_mitigator_offer_1" class="input_field criteria_risk" multiple="" style="width: 302px; display: none;" name="risk_mitigator_offer_1[]">      </div>          <div id="risk_wgt_cont_1">           <input id="risk_weight_1" class="input_field" type="text" maxlength="3" style="color:#777777; width: 40px;" value="0" name="risk_weight_1">      </div>       <div id="risk_del_cont_1">          <a id="delete_mitigator" href="javascript:void(0);" onclick="deleterisk(1)"></a>       </div>       <div style="clear:both"> </div>  <div id="risk_2" class="risk_main_div">      <div id="risk_drp_cont_2">          <select id="risk_mitigator_offer_2" class="input_field criteria_risk" multiple="" style="width: 302px; display: none;" name="risk_mitigator_offer_2[]">      </div>          <div id="risk_wgt_cont_2">           <input id="risk_weight_2" class="input_field" type="text" maxlength="3" style="color:#777777; width: 40px;" value="0" name="risk_weight_2">      </div>       <div id="risk_del_cont_2">          <a id="delete_mitigator" href="javascript:void(0);" onclick="deleterisk(2)"></a>       </div>       <div style="clear:both"> </div> 

you can use :has() selector :not() selector

$(".risk_main_div:not(:has(#firstiddrop))").remove(); 

if firstiddrop variable

$(".risk_main_div:not(:has(#" + firstiddrop +"))").remove(); 

$(function() {    $(".risk_main_div:not(:has(#firstiddrop))").remove();  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <div class="risk_main_div">1</div>  <div class="risk_main_div">2</div>  <div class="risk_main_div">3    <select id="firstiddrop">      <option>1</option>      <option>2</option>    </select>  </div>  <div class="risk_main_div">4</div>