$(document).ready(function() {
    $(".nav").children("li").each(function() {
        var current = "nav current-" + ($(this).attr("class"));
        var parentClass = $(".nav").attr("class");
        if (parentClass != current) {
            $(this).children("a").css({ backgroundImage: "none" });
        }
    });
    // create events for each nav item
    attachNavEvents(".nav", "default");
    attachNavEvents(".nav", "inhoud");
    attachNavEvents(".nav", "locprijs");
    attachNavEvents(".nav", "contact");

    function attachNavEvents(parent, myClass) {
        $(parent + " ." + myClass).mouseover(function() {
            $(this).append('<div class="nav-' + myClass + '"></div>');
            $("div.nav-" + myClass).css({ display: "none" }).fadeIn(200);
        }).mouseout(function() {
            $("div.nav-" + myClass).fadeOut(200, function() {
                $(this).remove();
            });
        }).mousedown(function() {
            $("div.nav-" + myClass).attr("class", "nav-" + myClass + "-click");
        }).mouseup(function() {
            $("div.nav-" + myClass + "-click").attr("class", "nav-" + myClass);
        });
    }
});