使上下文菜单事件特定于菜单被拉出的部分

问题：上下文菜单正在运行，但如果您在多个div上调出上下文菜单，它会记住单击事件。

要重新创建：右键单击一个部分。单击菜单外部以关闭它（不要选择选项）。单击另一个部分并选择一个选项。如果删除，它将删除菜单所指向的两个部分。如果您选择上下移动该部分，它将移动上拉菜单的第一个部分。

问题：如何优化以下JS/Jquery，使菜单中的事件保持特定于弹出菜单的部分？

JS Fiddle

$(".templateSection").contextmenu(function (event) {
    var thisTemplate = this;
    // Avoid the real one
    event.preventDefault();
    // Show contextmenu
    $(".custom-menu").toggle(100).    
    // In the right position (the mouse)
    css({
        top: event.pageY + "px",
        left: event.pageX + "px"
    });
    $(".editArea").css('outline', 'none')
    //Delete section menu button
    $("#menuDelete").click(function () {
        $(thisTemplate).remove();
        $(".custom-menu").hide(100);
    });    
    //Move sections up and down
    function firstAndLast(container) {
        firstAndLast($('#container'));
    }    
    $('.menuUp, .menuDown').click(function (e) {
        e.preventDefault();
        var parent = $(thisTemplate).closest('.templateSection'),
            grandparent = $(thisTemplate).closest('#container');
        if ($(this).hasClass('menuUp')) {
            parent.insertBefore(parent.prev('.templateSection'));
            firstAndLast(grandparent);
        } else if ($(this).hasClass('menuDown')) {
            parent.insertAfter(parent.next('.templateSection'));
            thisTemplate.clearQueue();
        }
    });
    // Hide menu if the document is clicked somewhere
    $(document).bind("mousedown", function (e) {
        //left mouse down
        switch (e.which) {
            case 1:
                // If the clicked element is not the menu
                if (!$(e.target).parents(".custom-menu").length > 0) {
                    // Hide it
                    $(".custom-menu").hide(100);
                }
        }    
    });
});