如何计算使用jQuery生成的类的数量？

Question

我有以下HTML代码。

此处存在2个添加/删除链接。 1）添加更多详细信息（+） 2）添加（+）

当我单击 Add（+）时，将其clone类div链接到tour_wrap并计算克隆/添加的trip_counting类div的数量。 赞：行程1，提示2，行程3等。

而且，我还有一个名为添加更多详细信息（+）的链接，该链接克隆了tour_wrap div。

因此，当我两次单击此链接例如时，它将克隆tour_wrap div 2次，这很好。

现在我有3 tour_wrap格。在这个div中，您可以看到我有3次 Add（+）链接，对吗？是。因此，当我单击任何 Add（+）链接时，它是在计算已添加的trip_counting个类的总数，但是我只想计算相应的trip_counting个类。

查看此图片：

HTML代码：

<div class="tour_wrap">
   <!-- some other html code for the tour -->
   <div class="trip_wrap">  
      <h5 class="badge badge-success trip_counting">Trip 1</h5>    
      <div class="col-md-4">
         <div class="form-group">
            <label>From</label>
            <input type="text" name="ow_from[]" class="form-control" placeholder="From">
         </div>
      </div>
      <div class="col-md-4">
          <div class="form-group">
            <label>To</label>
            <input type="text" name="to[]" class="form-control" placeholder="To">
         </div>
      </div>
      <div class="col-md-12">
         <div class="change_trip text-right">
            <a class="btn add_button_trip trip_btn">Add(+)</a>
         </div>
      </div>
   </div> <!-- end trip_wrap -->
</div> <!-- end tour wrap -->
<div class="row">
   <div class="col-md-12">
      <div class="form-group change text-right">
         <a class="btn add_button add_more add_more_btn"><strong>Add More Details (+)</strong></a>
      </div>
   </div>
</div> <!-- end row -->

jQuery代码：

// for all way
$("body").on("click",".add_button",function(){
  var html = $(".tour_wrap").first().clone();
  $(html).find(".change").html("<a class='btn remove remove_more'>Remove Details(-)</a>");
  $(".tour_wrap").last().after(html);

  $('.counting').each(function(i, elm) {
      $(elm).text('Detail ' + (i + 1));
  });
});

$("body").on("click",".remove",function(){
   $(this).parents(".tour_wrap").remove();
});

// add more trip
$("body").on("click",".add_button_trip",function(){
  var html = $(".trip_wrap").first().clone();
  $(html).find(".change_trip").html("<a class='btn remove_trip remove_more trip_btn_remove'>Delete(-)</a>");
  //$(".trip_wrap").last().after(html);
  $('.trip_wrap').each(function(i, elm) {
     $(elm).last().after(html);
  });

  $('.trip_counting').each(function(i, elm) {
     $(elm).text('Trip ' + (i + 1));
  });
});

$("body").on("click",".remove_trip",function(){
  $(this).parents(".trip_wrap").remove();
});