I'm currently utilizing a popup lightbox plugin that automatically generates next/prev buttons, but it doesn't enclose them within a container. I am looking to surround these buttons with a containing element, and although I have identified where they are generated in the plugin, I am struggling with how to wrap them as they are created as an object.
The default code for button generation appears as follows:
mfp.container.append(arrowLeft.add(arrowRight));
Prior to adding them to the container, my objective is to encapsulate them within a div with the class mfp-nav
. My attempt at achieving this was by using the following code snippet, however, it has not been successful due to the nature of the buttons being objects.
mfp.container.append('<div class="mfp-nav">' + arrowLeft.add(arrowRight) + '</div>');
When rendered on the front-end, the output looks like this:
<div class="mfp-nav">[object Object]</div>
Is there a simple way to wrap this object within a container without having to iterate over the object?