TLDR Using plain HTML / Javascript (Client Side) I want to prevent viewing of certain pages. The user will have to type a username and password and depending on that they get access to different pages.

Answers can NOT include server side whatsoever

It does not matter if they can break it easily. There is no sensitive information etc. Also the target audience will not have access to internet OR probably know what a cookie is...

At some point the user will have to type username / password.(I can define the cookie here)
Currently I thought of using cookies to set a cookie for each page to say "true" / "false" but that would get messy with so many cookies. Or setting an array within a cookie for each page?
I have div field "#Content" which as it looks encompasses all of my content on the page so blocking out content will be as simple as replacing it with ("sorry you don't have access") etc.

For Example:

$.cookie("Access","page1, page2, page3"{ expires: 1 });

I am looking for anyway to do this does not have to be with cookies.
Would be nice to get a discussion of different ways this can be done.

So the question is:
What do YOU think would be a good way to go about doing this with client side validation?