跳转到页面的特定部分时如何隐藏锚图标

Question

我有向下箭头点击跳转到页面的特定部分，点击滚动功能正常但我需要点击图标然后跳转到特定向下箭头图标将隐藏。

.scroll-regform, .mobile {
    display: block!important;
}
.scroll-regform {
    position: fixed;
    right: 44%;
    top: 200px;
    cursor: pointer;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    z-index: 3;
    line-height: 30px;
    text-align: center;
    color: #fff;
    font-size: 28px;

}

 <a href="#scroll-regform" href="#" class="scroll-regform"><i class="fa fa-angle-down animated-menu bounce" aria-hidden="true" alt="download" class="pt-8"></i></a>
 
 <div class="col-md-7" id="scroll-regform">
 <p>content</p>
 </div>

Answer 1

$( ".scroll-regform" ).click(function() {
  $(this).addClass('hideIcon')
});

.scroll-regform, .mobile {
    display: block!important;
}
.scroll-regform {
    right: 44%;
    top: 200px;
    cursor: pointer;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    z-index: 3;
    line-height: 30px;
    text-align: center;
    font-size: 28px;

}
.scroll-regform.hideIcon{
  display: none !important;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="#scroll-regform" href="#" class="scroll-regform"><i class="fa fa-angle-down animated-menu bounce" aria-hidden="true" alt="download" class="pt-8">ICON</i></a>
 
 <div class="col-md-7" id="scroll-regform">
 <p>content</p>
 </div>

跳转到页面的特定部分时如何隐藏锚图标

How to hide Anchor icon when jump to specific part of page

html

css

anchor