複数のJQ UIオートコンプリートエントリから値を持つカスタムdivを送信

Question

私は試験のリストで巨大なオートコンプリートフィールドを持っています。
このフィールドは、その直下のdivに値を付加します。

フォームの送信時にこのdivのすべての値を送信できる必要があります。
そして、私はdivの値を（投稿する前に）入力後に操作する必要があります。エントリー

を削除する各ライン上の小さなXのような
何かここでは、これまでに私のコードです：

$(function() { 
      function log(message) { 
     $("<p/>").text(message).prependTo("#exams"); 
     $("#exams").scrollTop(0); 
    } 

    $("#clearexamcell").click(function(){$("#examlist").val("");}); // clears the field, ignore 

    $("#examlist").focus(function(){$(this).val("");}); // clears the field, ignore 

    $("#enterdrug").click(function(){ 
     log ($("#examlist").val()); 
     });  

    var fullTags = ["...."]; 

    $("#examlist").autocomplete({ 
     source: fullTags, 
     select: function(event, ui) { 
      log(ui.item ? 
       "exam: " + ui.item.label : 
       "exam: " + this.value); 
     } 
    }); 
}); 

がここにHTMLです：

<form> 
<div class="ui-widget" ><label for="full0">Search Exam: </label> 
<br/><br/> 
<input style="width:600px;height:40px;" id="examlist" name="full0"> 

ボタンのカップル：

<input type="button" id="enterdrug" value="enter" > 
<input type="button" id="clearexamcell" value="clear"></div> 

結果を取得するdiv：

<div id="exams" style="width:100%;height:auto;padding-top:30px;border-bottom-style: solid;"> 
</div> 
...</form> 

これまでのところ、それは意図したとおりに動作し、同様にDIVを生成します。私はこれを操作して、フォームの残りの部分が完了したときのdivの内容を提出することができる方法上の任意のアイデアを

<div id="exams" style="width:100%;height:auto;padding-top:30px;border-bottom-style: solid;"> 
<p>selection1</p> 
<p>selection2</p> 
<p>selection3</p> 
<p>selection4</p> 
</div> 

？ ありがとうございます。

Answer 1

私はこの使用して終了：彼は
、これに入っているものをユーザーに表示する

 log(ui.item ? 
      "exam: " + ui.item.label : 
      "exam: " + this.value); 

を：

var updatedlist = $('div.exam').text(); 
     $("#submitexams").val(updatedlist); 

値をID #submitexamsと隠しテキスト領域を更新します表示されるdivの全体のうち

ボタンのクリックで両方が動作します

データの操作のためとして

、ユーザーがリストを編集したい場合、
私はこの追加：別のボタンのクリック時に両方の提出から最初の行（最後の提出試験）を除去し

$(document).ready(function(){ 
$(function() { 
$("#clearlastexamentry").click(function(){ 
$("div.exam li:first").remove(); 
var updatedlist = $('div.examlist').text(); 
$("#submitexams").val(updatedlist); 
}); }); }); 

をし、表示されたリスト。
私は何をしようとしていたのではなく、今のところ私の目的を果たしています。
デモが必要な場合、jsfiddleに似たようなコメントを投稿してください。