Jquery shows or hides a dynamic column based on its properties

<i id="await" th:attr="data-seconds ></i>
0<i id="underway"><div th:each="infolist : ${infolist}">for
jq
    <div th:each="infolist : ${infolist}">
       <div th:if="(${infolist.overTime} >= (${new java.util.Date().getTime()}/1000))" class="tab-pane fade in active" id="home">
            <div class="special-product-wrap"th:onclick=""javascript:runOn(\""+${infolist.productId}+"\");"">
            
                <div class="special-product special-product2">
                    <div class="p-img">
                        <img src="/image/1.jpg" alt="" />
                        <div class="p-extra underway" th:id=""underway" + ${infolist.productId}">
                            <div class="p-state p-state1"></div>
                            <div class="p-time">
                                <span>
                        <i id="underway" th:attr="data-seconds=(${infolist.overTime}-(${new java.util.Date().getTime()}/1000))">
                            <span></span>:<span></span><span></span><span></span><span></span>
                        </i>
                    </span></div>
                        </div>
                        <div class="p-extra await" th:id=""await" + ${infolist.productId}">
                            <div class="p-state p-state1"></div>
                            <div class="p-time">
                                <span>
                         <i id="await" th:attr="data-seconds=(${infolist.runTime}-(${new java.util.Date().getTime()}/1000))">
                            <span></span>:<span></span><span></span><span></span><span></span>
                        </i>
                    </span></div>
                        </div>
                    </div>
                    <div class="p-detail">
                        <div th:text="${infolist.productName}" class="p-name"></div>
                        <div class="p-info J_ping" report-eventid="MAuction_SpecialInstitution" report-eventparam="675200">
                            <div class="p-number"><span class="f-red" th:text="${infolist.productStock}" ></span><b></b><span class="f-red" >10</span></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
   </div> 
    

< script type= "text/javascript" th:inline= "javascript" >

$(function () {
    $("i").countdown(function (s, d) {
        var items = $(this).find("span");
        // items.eq(0).text(d.total);
        items.eq(1).text(d.day);
        items.eq(2).text(d.hour);
        items.eq(3).text(d.minute);
        items.eq(4).text(d.second);
        console.log($("-sharpawait").attr("data-seconds"))
        $("-sharpawait").on("smile", function () {
            if ($("-sharpawait").attr("data-seconds")>0){
                $("-sharpunderway").hide();
                $("-sharpawait").show();
            }else {
                $("-sharpunderway").show();
                $("-sharpawait").hide();
            }
        });
        $("-sharpawait").tigger("smile");

    });
    console.log($("-sharpawait").attr("data-seconds"))
});

< / script >

Menu