when I press a try it button at the bottom of my page, it reloads the page and deselects all checkboxes. THe main problem i have with this is that when i select a box and click total, the total will be displayed for a split second, before the page reloads back to a state of nothing being checked.
enter image description here

>Solution :

If you want to don’t reload the page. so you can use event.preventDefault(); when you use the event prevent function, this function block reloading the page clicking/pressing the "try it" button.