Javascript JQuery无法 Select 使用elementor添加的元素的值

我用Elementor定制代码编写了这个代码

<script>
jQuery(document).ready(function($){
    $('#ship-price').on('click', function(){
            var originalPrice = $('#product-price').val();
            console.log(originalPrice);
            //
            var shipPrice = $('#ship-price').val();          
            console.log(shipPrice);
    });
});
</script>

我正在try Select 使用elementor添加的两个元素，并在其中分配了一个css id.就会出现我无法读取产品价格和发货价格的情况.

我需要实现的是显示一个不同的产品价格是使用woocommerce加载，用户点击后.我如何解决这个问题？

UPDATE个 这是产品价格的html.

<div class="elementor-element elementor-element-2cf415f elementor-widget elementor-widget-heading" data-id="2cf415f" data-element_type="widget" id="product-price" data-widget_type="heading.default">
                <div class="elementor-widget-container">
            <h2 class="elementor-heading-title elementor-size-default"><span class="woocommerce-Price-amount amount"><bdi>499,00&nbsp;<span class="woocommerce-Price-currencySymbol">€</span></bdi></span>*</h2>        </div>
                </div>

这是我需要获取的船价的渲染html

<div id="elementor-tab-content-3201" class="elementor-tab-content elementor-clearfix elementor-active" data-tab="1" role="region" aria-labelledby="elementor-tab-title-3201" style="display: block;"><ul>
<li><a href="#" id="ship-price-a">70€ + IVA</a> ...</li>
<li><a href="#" id="ship-price-b">79€ + IVA</a> ...</li>
</ul></div>