Как добавить элемент автозаполнения jquery ui?

Question

Я хотел бы знать, как добавить элементы автозаполнения jquery ui после того, как страница активна.

Идея состоит в том, что есть два элемента, и я хотел бы добавить третий элемент после нажатия кнопки отправки.

Вот мой код:

$(function() { 
    var projects = [{ 
      value: '123', 
      label: 'Element 1', 
      desc: 'Element 1 Description', 
      icon: 'element1icon.png' 
     },{ 
      value: '456', 
      label: 'Element 2', 
      desc: 'Element 2 Description', 
      icon: 'element2icon.png' 
     } 
    ,]; 

    $("#desc1").autocomplete({ 
     minLength: 0, 
     source: projects, 
     focus: function(event, ui) { 
      $("#desc1").val(ui.item.label); 
      return false; 
     }, 
     select: function(event, ui) { 
      $("#desc1").val(ui.item.label); 
      $("#desc-id1").val(ui.item.value); 

      return false; 
     } 
    }) 
    .data('ui-autocomplete')._renderItem = function(ul, item) { 
     return $('<li>') 
     .append('<a>' + item.label + '<br>' + item.desc + '</a>') 
     .appendTo(ul); 
    }; 
}); 

$("#submit").click(function() { 
    var itemtoadd = $("#addelementtext").val(); 
    alert("This action should insert the element " + itemtoadd); 
}); 

HERE IS THE FIDDLE

EDIT:

Идея заключается в том, что старое текстовое поле появляется с новым элементом ЭЛЕМЕНТ 3, как если бы он был объявлен как это:

var projects = [{ 
      value: '123', 
      label: 'Element 1', 
      desc: 'Element 1 Description', 
      icon: 'element1icon.png' 
     },{ 
      value: '456', 
      label: 'Element 2', 
      desc: 'Element 2 Description', 
      icon: 'element2icon.png' 
     },{ 
      value: '789', 
      label: 'Element 3', 
      desc: 'Elemen 3 Description', 
      icon: 'element3icon.png' 
     }, 

    ,]; 

Answer 1

Добавить перед кнопкой:

$('#submit').before('<input type="text" value="test" />'); 

http://jsfiddle.net/2GvuB/1/