CodePen has a couple of it’s own issues to be aware of:
This is why your HTML page received this error: You don’t need a DOCTYPE on CodePen. Just put here what you would normally put in the .
I’m not sure how this plays with your code, but you could change $("#ban1").addClass(“hide”); by removing the addClass and just make it $("#ban1").hide( ); . You can do the same thing with $("#ban1").show( );
You may want to consider creating one clock function regarding the minutes/seconds and display. On start it would count down the session (think something like sessionOn = true, breakOn = false). Then when the clock reaches 00:00 you can makes sessionOn = false and breakOn = true. Give a couple of seconds to play the beep and switch to the Break function.
It’s looking good and I can see how hard you are working on it. Keep up the good work.