Bootstrap : Popover innerHTML content onclick not working

I am creating custom Bootstrap popover

// Pop up buttons js
            var popupElement = '<div class="btn-group"><span class="reEnter"><button type="button" class="btn btn-primary btn-xs" id="reEnter" value="ReEnter">ReEnter</button></span><span class="copy"><button type="button" class="btn btn-primary btn-xs" id="copy" value="Copy">Copy</button></span><span class="appendCopy"><button type="button" class="btn btn-primary btn-xs" id="appendCopy" value="Append">Append</button></span></div>';

            $('#morePopButton').popover({
                animation: true,
                content: popupElement,
                html: true
            });

Then I am trying to catch each button id in my JS as below

         $('body').on('click', '.btn-group', function () {

                document.getElementById('reEnter').onclick  = function (event) {

                    if (event.target.id === 'reEnter') {
                        var mainElement = document.getElementById('reEnter');
                        var element = document.getElementById('reEnter').innerHTML;
                        console.log(mainElement);

                        if (element == "ReEnter") {
                            sabreTerm.reEnter();
                            textVisible();
                            if (!e)
                                var e = event;
                            e.preventDefault();
                        }
                    }


                }

            });

But Onclick function not working but it is coming in the body of onclick.

My issue I have 3 buttons inside my popover and want to catch there click listener and want to perform my method on each id, but onclick is not working with innerHTML.