JQuery获取与所选元素最近的div

我的HTML标记如下所示：

<div class="col-xs-6">
  <div class="form-group">
      <select id="select" class="form-control voip_destination_select">
      <option>Select</option>
      </select>
  </div>
</div>

<div class="col-xs-6 voip_destination_number2">
  <div class="form-group">
      text
  </div>
</div>

更新的HTML选项

挑选
文本

您的逻辑很接近，但问题是因为

.voip\u destination\u number2

不是引发事件的

select

的父级，因此

closest（）

调用不会返回任何结果

要解决此问题，您需要获取最近的父元素，它是

.voip\u destination\u number2

，在本例中为

col-xs-6

，然后使用

next（）

，如下所示：

$（'.voip\u destination\u select'）。打开（'change'，function（））{
$（this）.最近（'.col-xs-6'）。下一个（'.voip_destination_number2'）。addClass（'foo'）；
});
.foo{color:#C00；}

挑选
1.
2.
3.
文本
首先，您必须使用class
col-xs-6
向上遍历DOM via到您的div，然后转到它的同级via，然后返回DOM via。像这样：

$('.voip_destination_select').on('change', function() {
    $(this).closest('div.col-xs-6').next().find('.voip_destination_number2')
});

唯一的问题是，我的代码
col-xs-6
在所有地方都不一样。是否可以只使用类
voip\u destination\u number2
，在这种情况下，您需要找到另一种方法来定位特定的
div
，但逻辑是相同的。您可能会更高一级并使用
find（'.voip\u destination\u number2'）
但这仅在其中包含其中一个元素时有效。如何交换类名并将
voip\u destination\u number
放在第一位，或将
col-xs-6
div包装在另一个div中，其中包含类
voip\u destination\u number
，这可能会起作用。如果您可以更新问题以显示HTML布局，我将为您更新答案。我想知道这是否可行，因为我正在努力查找div中动态创建内容
<div class="col-xs-6">
  <div class="form-group">
      <select id="select" class="form-control voip_destination_select">
      <option>Select</option>
      </select>
  </div>
</div>

<div class="col-xs-6">
  <div class="form-group">
      <div class="voip_destination_number2">
          text
     </div>
  </div>
</div>

$('.voip_destination_select').on('change', function() {
    $(this).closest('div.col-xs-6').next().find('.voip_destination_number2')
});