jQuery Parent UL Background Change on Click

**I currently have this jQuery drop menu working fine but I'm wanting the parent ul to have a background change when clicked and when unclicked for it to change back to the first background, I have tried a couple things but cant get it to work, Check out the website to see what I mean http://www.media21a.co.uk/clientlogin/benaiahmatheson/benaiah-matheson/profile/

Thank you for any help : ) **

$(document).ready(function(){   

    $('.navigation > ul > li > a, .shoppingbasket a').click(function(e){
        if($(this).parent().find('ul')){
            e.preventDefault();
        }
    });

    $(".navigation ul ul, .shoppingbasket ul ul").css({display: "none"});
    $(".navigation ul li, .shoppingbasket ul li").click(function(){
        $(this).find('ul:first').slideToggle(400);
    });

});

$('.navigation > ul > li > a, .shoppingbasket a').click(function(e){
    if($(this).parent().hasClass('current')){
        $(this).parent().removeClass('current');
    }else{
        $(this).parent().addClass('current');
    }
    if($(this).parent().find('ul')){
        e.preventDefault();
    }
});

CSS:

.current{
    background: #f00;
}