HTML buttons on separate div to play canvas animation

Hi All,

I'm hoping someone can point me in the right direction. I've exported my canvas animation just fine and all the buttons function, however, I need to place the buttons on a separate div so that it is at the top level of the rest of the design. Here is what I started:

HTML:

<button id="button_10" type="button" >projects</button>

JS:

<script>

document.getElementById("button_10").addEventListener("click", myFunction);

function myFunction() {

   document.getElementById("canvas").fl_ClickToGoToAndPlayFromFrame_4.bind(this));

function fl_ClickToGoToAndPlayFromFrame_4()

{

this.gotoAndPlay(1);

}

}

</script>

<script>

var canvas, stage, exportRoot, anim_container, dom_overlay_container, fnStartAnimation;

function init() {

canvas = document.getElementById("canvas");

anim_container = document.getElementById("animation_container");

dom_overlay_container = document.getElementById("dom_overlay_container");

var comp=AdobeAn.getComposition("19EDC99F39D3DC478ED3A7B69C8D50AC");

var lib=comp.getLibrary();

handleComplete({},comp);

} ...

</script>