Replace and load another javascript file on button Click

Question

 <div id="summary"><div id="container"></div> <div id="blocker"></div> <script type ="text/javascript" src="user.js"></script> </div> <button type="button">Personal</button> <a href="#" onclick="f1(1);"<button type="button">Apps</button></a> <button type="button" >Settings</button> 

I have this html file where i am loading a user.js file. But what I am trying to do is to replace that user.js file and load apps.js file whenever that Apps button is clicked and also load user.js file when personal button is clicked but for some reason i am not able to do that. This is the code I have written for that:

 function f1(id) { $('#summary').html(' <script type ="text/javascript" src="apps.js"> </script>'); } 

Answer 1

try this :

<div id="summary">
<script src="user.js"></script>
</div>
<button type="button" onclick="app(1);">
Personal
</button>
<a href="#" onclick="app();">
Apps
</a>
<button type="button" >
Settings
</button>
<script>                        
function app(number) 
{
    if (number == null) {
        $('#summary').html("<script src='app.js' />")
    }
    if (number != null) {
        $('#summary').html("<script src='user.js' />")
    }
}
</script>