Untitled

<html>
<meta charset="utf-8">
<head>
</head>
<body>
   <div id="roodBlok" style="margin:100px;
                             background-color:pink;
                             padding:20px;
                             colour:white" >
       <img src="afbeeldingA.jpg" alt="aap1" id="plaatje">
   </div>
   <div id="greenBlok" class="classA" style="margin:100px;
                              background-color:#0a0;
                              padding:20px;
                              colour:white" >


 </div>

   <script>

   var actievePlaatje = "A";

   function deknop() {
     alert("fsajfsi");
   }


 function GeefMijEenMop() {
document.getElementById("roodBlok").innerHTML = ("Wat is een ander woord voor dode vlieg? Een vloog")

}

document.getElementById("greenBlok").onclick = GeefMijEenMop

 function GeefMijNogEenMop() {
document.getElementById("greenBlok").innerHTML =("Wat is groen en rijdt op een paard? Een spruiter")

}


document.getElementById("roodBlok").onclick = GeefMijNogEenMop

function doealles(){
  GeefMijNogEenMop();GeefMijEenMop();deknop();
}

function veranderPlaatje() {
  //console.log("functie veranderPlaatje aan");
  //console.log(actievePlaatje);
  if(actievePlaatje=="A") {
    document.getElementById("plaatje").src = "afbeeldingB.jpg";
    actievePlaatje = "B";
  } else {
    document.getElementById("plaatje").src = "afbeeldingA.jpg";
    actievePlaatje = "A";
  }


  // hier wordt afbeelding B neergezet
  //document.getElementById("plaatje").src = "afbeeldingB.jpg";
  //actievePlaatje = "B";
  //alert("functie klaar");
  var p = 10 + 50
  return p
}

var re = veranderPlaatje();

document.getElementById("plaatje").onclick = veranderPlaatje


   </script>

<button onClick="doealles();">klik hier</button>
<button onClick="GeefMijEenMop();">klik hier</button>
<button onClick="deknop();">klik hier</button>

</body>
</html>