sessionStorage seems to be working at random.

Question

I have created this piece of code

   $('#date a').click(function(){
    delete sessionStorage.image;
    delete sessionStorage.type;
    sessionStorage.type = 'Weakest Link';
    sessionStorage.image = '<a class="charlie"  href="#date"><img src="images/tea cup 01.jpg" width="50" style="margin-left:-11px !important;margin-bottom:-14px !important;margin-top:-10px !important;"></a>';
    });
     $('#date1 a').click(function(){
     delete sessionStorage.image;
delete sessionStorage.type;
    sessionStorage.type = 'Peaches & Cream';
    sessionStorage.image = '<a class="charlie"   href="#date1"><img src="images/tea cup 02.jpg" width="50" style="margin-top:-10px !important;margin-left:-11px !important;margin-bottom:-14px !important;"></a>';
    });
    $('#date2 a').click(function(){
     delete sessionStorage.image;
     delete sessionStorage.type;
    sessionStorage.type = 'weetabix';
    sessionStorage.image = '<a class="charlie"   href="#date2"><img src="images/tea cup 03.jpg" width="50" style="margin-top:-10px !important;margin-left:-11px !important;margin-bottom:-14px !important;"></a>';
    });
    $('#date3 a').click(function(){
     delete sessionStorage.image;
     delete sessionStorage.type;
    sessionStorage.type = 'Plumbers Mate';
    sessionStorage.image = '<a class="charlie"   href="#date3"><img src="images/tea cup 04.jpg" width="50" style="margin-top:-10px !important;margin-left:-11px !important;margin-bottom:-14px !important;"></a>';
    });

so on and so forth up to 12 times. this session is then stored into the database.

My problem is that in the session that is stored into the database is sometimes "undefined" for both sessions. and sometimes its the session that should have been inserted previous that gets inserted into the database for the current.

Sometimes it also works perfectly.