单击更改外部元素上的jQuery

Question

我的结构如下：

<div class="summary entry-summary">
  <form>
    <div class="single_variation_wrap">         
      <div class="single_variation">
        <span class="price">
           <span class="amount">200.00грн.</span>
        </span>
        <p class="stock out-of-stock">Нет в наличии</p></div>
      </div>
    </div>
  </form>
  <ul class="variation-select" attr="pa_varnish_color"></ul>
  <ul class="variation-select" attr="pa_type_of_furniture"></ul>
</div>

我需要

click $(".variation-select").last().click(function () { })

变化

  <p class="stock out-of-stock">Нет в наличии</p> 

像这样：

`$("p.stock").prependTo(".single_variation");` 

• 将p.stock移动为.single_variation的第一个元素。 我需要在点击时执行此操作，因为首先在页面加载时没有.single_variation_wrap它是隐藏的。单击最后一个.variation-select .single_variation_wrap变为可见。 为了更好地理解我加载我的页面托管和添加链接在这里。另外，我添加了截图，我解释了我需要做什么。

页面链接：Product page link

Answer 1

附加到不变的祖先的委托click事件处理程序将执行您所声明的内容，但我不确定您的目标是什么（不是没有更多的HTML和代码）：

 $(".summary").on("click", ".variation-select:last", function () { })

通过在事件时间而不是事件注册时间（这是.variation-select:last所做的那样）应用jQuery选择器（click()）。 ）。任何click事件都会冒泡到您的class="summary"元素，然后选择器将应用于冒泡链中的任何元素，然后您的函数将针对导致该事件的任何匹配元素运行。在这种情况下，您的上一个variation-select元素。