I need some help, I've got the following HTML code:

```
<ul class="menu-list">
  <li class="active"><a href="cont1.html" title="Title 1">Link 1</a></li>
  <li><a href="cont2.html" title="Title 2">Link 2</a></li>
  <li><a href="cont3.html" title="Title 3">Link 3</a></li>
  <li><a href="cont4.html" title="Title 4">Link 4</a></li>
</ul>

<div class="content">           
   <div class="innerContent">
        <!-- Insert external HTML content here -->
   </div>
</div>

```

So, when I click "Link 1", for example, I need to get the inner content from "cont1.html" to be appended inside of the div class="innerContent", not forgetting to add the "class="active"" inside the clicked li. Using just Javascript/AJAX without Jquery and without changing this HTML. 

I did a similar [**example here**](https://stackoverflow.com/questions/15884640/hide-and-show-elements-by-clicking-on-a-link-with-java-script-without-jquery/15935020#15935020), but is working for the content of the same page, not different pages, and I don't know why but doesn't work on IE.

Please, someone can help me?