Code:
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("#selection li").click(function(){
    var x= $(this).text();
    $("#destiny").append(x);
  });
});
</script>
</head>
<body>
<ul id="selection">
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>

</ul>
<p id="destiny"></p>
</body>
</html>

i have a unordered list and a paragraph. when i click on the text from the lists, it should appear in the paragraph tag (basic selection process).
Now i want to limit this selection. Means If the selection of list item is already made and we tried to select it again, it should give error(you have already selected item 1/2/3).

and how can i use list instead of paragraph. I have done this but only "x" gets printed. pls help.

Code:
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("#selection li").click(function(){
    var x= $(this).text();
    $("#destiny").append("<li>'x'</li>");
  });
});
</script>
</head>
<body>
<ul id="selection">
<li>shahrukh</li>
<li>aamir</li>
<li>salman</li>
<li>shahid</li>
<li>ranbir</li>
</ul>
<ul id="destiny"></ul>
</body>
</html>