I have a Special Idea about an Edit function

Question

All the Functions below are under a $(document).ready(function()) !

First I have an input which you can fade in/out its looks like this:

Answer 1

at the moment it looks like this:

$("#liste").click(function selectList (event) {
    var target = $( event.target );
    if ( target.is( "li" ) && !$("li").hasClass('selected')) {
        target.addClass('selected');
    }
    else if (target.is( "li" ) && $("li").hasClass('selected')) {
        target.removeClass('selected');
    }
});

$('.deleteSel').click(function delSelectedEntries () {
    alert("Ausgewählte Beiträge wuden gelöscht");
    var sel = $('.selected'); //stores the entrys 
    sel.remove(); // removes only the list entrys temporaly
});

$(".edit").click(function editSelectedEntries(){    
    var index = $('.selected').attr("index");
    edit(index);
});

edit Function:

function edit (index){

    $( "#block" ).fadeIn(500);  
    $( "#block" ).animate({width: '54.4%', opacity: '0.8',fontSize: '1.5em'}, 750);
    $( "#block" ).animate({height: '40%', opacity: '0.8', fontSize: '3em'}, 750);

    $('#alter').val(list[index].alter);
    $('#vorname').val(list[index].vorname);
    $('#nachname').val(list[index].nachname);   
    $('#geschlecht').val(list[index].geschlecht);

    $('.send').click(function onClick(){ 

        var age = $('#alter').val(); 
        var preName = $('#vorname').val();
        var secName = $('#nachname').val();         
        var gender = $('#geschlecht').val();

        list[index] = {
            vorname: preName,
            nachname: secName,
            alter: age,
            geschlecht: gender
        };

        generateList();
    });