i want to add a images on the fly with event **click** and it not replace the currenly something inside div.

my currently code look like this.

**HTML**

```
<div id="btn"><img src="images/Leviathan.png"></div>
<div id="ctn" contenteditable="true"></div>

```

**JavaScript**

```
<script>
var btn = document.getElementById('btn');
var ctn = document.getElementById('ctn');

btn.addEventListener('click', function(){
ctn.innerHTML = btn.innerHTML;}, false);
</script>

```

my currently code is it replaces what i have add to div. let's say inside div. there's a text "Stackoverflow is awesome". when i clicked on images it replace to . it not just add "Stackoverflow is awesome `<img src="foo.jpg">`"

nb: Answer it on JavaScript not JQuery. thank you for reading :)