quota_exceeded_err 22 on Mobile Safari (iOS) when using localStorage of html5

Using localStorage of html5 is pretty straight forward.

var bar = 'this is the value to store';

localStorage.setItem('foo',bar);

localStorage.getItem('foo');

localStorage.removeItem('foo');

Testing was smooth on Chrome, Firefox, desktop Safari...

However when testing on Mobile Safari, i got the following error...
"quota_exceeded_err 22"

Goggled around for the issue to no avail.
Finally came across a blog with the solution to this problem.

Which is to turn "private browsing" off in Safari.

To do that... Go to "Settings"

Scroll to "Safari"

Under "Privacy" group, Set "Private Browsing" to OFF.

Hope this can help you the few hours of googling.

The blog that i found : http://frederictorres.blogspot.com/2011/11/quotaexceedederr-with-safari-mobile.html