Use a js function after another function

Vote count:

0

  <div class="panel" id="home">
    <video id='video1' width='630' autoplay controls>
        <source id="source1" src="1_uno.mp4" type="video/mp4">
    </video>
  </div> 

I' ve this js function that at the and of 'video1' makes the refresh of div home putting 3 buttons

   var myVideo = document.getElementById("video1");
   myVideo.addEventListener('ended',myHandler,false);
   function myHandler(e) {
      document.getElementById('home').innerHTML = 
     '<button type="button" style="height: 180px; width: 200px"  onclick="refreshdiv("a")"> a </button><button type="button" style="height: 180px; width: 200px" onclick="refreshdiv("b")"> b </button><button type="button" style="height: 170px; width: 200px" onclick="refreshdiv("c")"> c </button>';
}

Until this part everything works good, now as u can see onclick event i do refreshdiv function:

    function refreshdiv(str) {
if(str=='a'){
   src='1_uno.mp4';
}
if(str=='b'){
   src='2_due.mp4';
}
if(str=='c'){
   src='3_tre.mp4';
}
document.getElementById('home').innerHTML = '<video id="video1" width="630" autoplay controls><source id="source1" src="'+ src +'" type="video/mp4"></video>';
}

The problem is when i click on the buttons anything happens and in chrome i got this error: Unexpected token }

All the fuction are inside:

asked 40 secs ago

user3658308

3