Verify fiddle and ajax works
Todo handling
HTML
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<button id="btn">Press Me</button>
<div>
<h1>
Stuff
</h1>
</div>
<div class="row">
<h2>Testing jQuery and jsFiddle</h2>
<div id="left" hidden>
<select id="expense">
<option value="Automobile">Automobile</option>
<option value="Eating Out">Eating Out</option>
<option value="Mortgage">Mortgage</option>
</select>
</div>
<div id="right" hidden>
<select id="income">
<option value="Salary">Salary</option>
<option value="Gift">Gift</option>
</select>
</div>
</div>
<div>
<h3>Other stuff</h3>
</div>
CSS
#status {
color: blue;
}
#status.done {
color: green;
}
#status.fail {
color: red;
}
#right {
color: blue;
}
#left {
color: red;
}
JavaScript
$("#btn").click( () => {
if($("#left").is(":visible")) {
$("#left").hide();
$("#right").show();
}else{
$("#right").hide();
$("#left").show();
}
});