How do I get the href value when collapse is done?

Question

I want to get the href value in the Accordion toggle or collapsed process.

<div class="row">
    <div class="col-md-12">
        <div class="portlet">
            <div class="portlet-heading bg-inverse">
                <h3 class="portlet-title">acilsusam 1</h3>
                <div class="portlet-widgets">
                    <a data-toggle="collapse" data-parent="#value1" href="#birinci"><i class="ion-minus-round"></i></a>
                </div>
                <div class="clearfix"></div>
            </div>
            <div id="birinci" class="panel-collapse collapse show" style="">
                <div class="portlet-body">
                    <div class="row">
                        <div class="col-xl-3">
                            <a href="cizmelikedi.php?id=1">
                                <div class="widget-bg-color-icon card-box p-l-0 m-b-0">
                                    <div class="bg-icon pull-left m-r-10">
                                        <i class="md  md-mail text-danger" style="font-size: 60px !important;"></i>
                                    </div>
                                    <div class="text-left m-t-15">
                                        <p class="text-muted">sunucu nunu 1</p>
                                    </div>
                                    <div class="clearfix"></div>
                                </div>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="row">
    <div class="col-md-12">
        <div class="portlet">
            <div class="portlet-heading bg-inverse">
                <h3 class="portlet-title">acilsusam 2</h3>
                <div class="portlet-widgets">
                    <a data-toggle="collapse" data-parent="#value" href="#ikinci"><i class="ion-minus-round"></i></a>
                </div>
                <div class="clearfix"></div>
            </div>
            <div id="ikinci" class="panel-collapse collapse show" style="">
                <div class="portlet-body">
                    <div class="row">
                        <div class="col-xl-3">
                            <a href="cizmelikedi.php?id=1">
                                <div class="widget-bg-color-icon card-box p-l-0 m-b-0">
                                    <div class="bg-icon pull-left m-r-10">
                                        <i class="md  md-mail text-danger" style="font-size: 60px !important;"></i>
                                    </div>
                                    <div class="text-left m-t-15">
                                        <p class="text-muted">sunu bunu yap</p>
                                    </div>
                                    <div class="clearfix"></div>
                                </div>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

I tried a lot of things, but somehow href="#birinci" did not get the value here.

$('.collapse').on('hidden.bs.collapse', function () {                           
   var sectionID = $('.collapse').closest('a').attr('href');                                    
   $.ajax({                                     type: "POST",                                       
     data: "collapse_islemi=1&islem=e&collapse="+sectionID,                                     
     url: "https://localhost/ajax.php",                                     
     success: function(html) {}                                 
   });
});

I've tried a lot of ways when I want to get the value when I change. I tried with find attr, but I get an undefined warning every time.

Answer 1

$('.collapse').on('hidden.bs.collapse', function () {        
    alert(e.currentTarget.id);
});

I got the values as above.