使用jquery获取h2文本并将其打印到另一个div

我想从h2标签中获取产品名称文本，并将其作为列表元素传递到另一个div中。我希望此事件发生在单击“添加到购物车”按钮时

（我有更多产品项文章元素）

这是我的HTML。谢谢大家的帮助

<article class="product-item">
    <div class="product-title title-preorder">
        <h2><a href="#">This is my product name here</a></h2>
        <span class="preorder">
        Avaible
        </span>
    </div>
    <div class="product-params">
        <div class="product-img">
            <img src="/image/10428.jpg" alt="image">
        </div>
        <div class="product-details">
            My description here
        </div>
    </div>
    <div class="product-cart">
        <div class="price">
            $45 
        </div>
        <div class="amount">
            <input id="345346" value="1" class="spinner" /> 
        </div>
        <a class="add-to-cart" ><i class="fa fa-shopping-cart"></i>Add to Cart</a>
    </div>
</article>

<div class="product-list">
    <ul>
        <li>I'd like to print h2 text here
        </li>
    </ul>
</div>

有效的
我的描述在这里
$45 
添加到购物车

我想在这里打印h2文本

您可以使用获取标题文本和添加新列表项

$（'.add to cart'）。单击（函数（）{
$（'.product list ul'）。追加（'
'+$（'h2'）.text（）+'
'）；
});

有效的
我的描述在这里
$45 
添加到购物车

我想在这里打印h2文本


：

在你的帮助下，我解决了它。我不得不在函数中使用“最近的”方法，现在它工作得很好

$('.add-to-cart').click(function(){
   $('#cart-content-inner ul').append('<li>'+$(this).closest(".product-item").find('h2 a').text()+'</li>');
});

$（'.add to cart'）。单击（函数（）{
$（“#购物车内容内部ul”）.append（“
”+$（this）.closest（“.product item”）.find（'h2 a'）.text（）+”
）；
});
如果所有答案都无效，或者您仍然面临问题，请告诉我，以便我可以提供帮助。我有3个产品项目文章，其中有3个“添加到购物车”按钮。此解决方案几乎可以工作，但可以打印列表项中的所有3个h2文本。现在我有3个名字在里面。是否可以只打印当前文本？您所说的当前文本是什么意思？你能解释一下吗？有很多方法可以做到这一点。您可以在每个产品之外设置复选框，以便用户选择要添加到购物车中的产品，或者您可以显示所有产品链接，但暂时不显示“添加到购物车”按钮，然后单击任何产品“添加到购物车”按钮将可见，然后您可以将项目添加到购物车中。
$('.add-to-cart').click(function(){
   $('#cart-content-inner ul').append('<li>'+$(this).closest(".product-item").find('h2 a').text()+'</li>');
});