Here are the slides of the lecture on javascript.
Here is the code we wrote in class:
{{extend 'layout.html'}}
{{block head}}
<style>
.colorred {color: red;}
.colorblue {color: blue;}
</style>
<script>
$(document).ready(function() {
// Here goes what you want to do once the page has loaded.
$("#bred").click(function() {
// console.log("The click is detected");
$("#firstline").removeClass().addClass("colorred");
});
$("#bblue").click(function() {
$("ul li").removeClass().addClass("colorblue");
});
});
</script>
{{end}}
<ul>
<li id="firstline">First</li>
<li id="secondline">Second</li>
</ul>
{{=A('Red', _class='btn', _id="bred")}}
{{=A('Blue', _class='btn', _id="bblue")}}