Here I am trying to add html to an element using innerHtml

```
  <body>
 <h3>Dynamically Retrieve the chapter name</h3>
<div>
<div>
    <button id="addChapter">Add Chapter</button>
    <div id="courseStructure">

    </div>
 </div>
 </div>
<script src="index.js"></script>
</body>

```

JS:

```
var addChapter = document.getElementById("addChapter");

  addChapter.onclick = function(){
document.getElementById("courseStructure").innerHtml += '<div><input type="text" name="chaptername" placeholder="chapter name"/><button id="addSubChapter">Add SubChapter</button><button id="addContent">Add Content</button><br><br></div>';
 }

```

everything seems good the onclick event is firing when button is clicked but the html is not getting added to the element.