Javascript 如何删除jQuery中除第一个元素和第二个元素之外的所有元素？

HTML

<div class="geo_select">
      <h3>header 3</h3>
      <div class="row form-group">
         default content
      </div>
      <div class="row form-group">
         //Dynamic content 1 here
      </div>
     <div class="row form-group">
         //Dynamic content 2 here
      </div>

    </div>

标题3
默认内容
//这里是动态内容1
//这里是动态内容2

---

在上面的HTML代码中，我想删除jquery中

和

内的默认内容以外的所有元素。。如何删除jquery中除前2个元素以外的所有元素？在我上面的场景中？

如果需要，您可以直接使用CSS

.geo_select > div:not(:first-of-type) {
    display:none;
}

---

如果你愿意，你可以直接使用CSS

.geo_select > div:not(:first-of-type) {
    display:none;
}

---

在jQuery中有几种方法可以做到这一点

// use this, if there are different types of elements as child 
$('.geo_select > div:nth-of-type(n+3)').remove()

// use any of these if childs are same
$('.geo_select > div:nth-child(n+3)').remove()
$('.geo_select > div:gt(2)').remove()

// this is jQuery way which reduce the set into the range 
$('.geo_select > div').slice(2).remove()

---

或者使用css，只需将其隐藏

.geo_select > div:nth-of-type(n+3){
   display:none;
}

---

在jQuery中有几种方法可以做到这一点

// use this, if there are different types of elements as child 
$('.geo_select > div:nth-of-type(n+3)').remove()

// use any of these if childs are same
$('.geo_select > div:nth-child(n+3)').remove()
$('.geo_select > div:gt(2)').remove()

// this is jQuery way which reduce the set into the range 
$('.geo_select > div').slice(2).remove()

---

或者使用css，只需将其隐藏

.geo_select > div:nth-of-type(n+3){
   display:none;
}

---

为所有动态内容提供一个附加类并删除该类中的所有div元素。这不是更容易吗？为所有动态内容提供一个附加类并删除该类中的所有div元素。这不是更容易吗？