flippant.js does not pull html. Displays [object HTMLDivElement] instead

Question

I am attempting to create a modal that flips. The front modal displays fine however the back modal just displays [object HTMLDivElement] instead of displaying the modal.

<script type='text/javascript'>
    $('#introModal').modal('show');
    window.onload = function () {
    function flip() {

        var front = document.getElementById('introModal');
        var back_content = document.getElementById('backModal'); // Generate or pull any HTML you want for the back.
        var back;

        // when the correct action happens, call flip!
        back = flippant.flip(front, back_content)
        // this creates the back element, sizes it and flips it around.

        // call the close method on the back element when it's time to close.
    }

    document.getElementById('testbutton').onclick = flip;
};
</script>

Answer 1

Then extract html for it :)

var back_content = $('#backModal').html()

or

var back_content = document.getElementById('backModal').innerHTML;

or

var back_content = document.getElementById('backModal').outerHTML;