javascript - How to dynamically add clear button for each value using jquery? -

i trying add clear button each value , to delete satisfy value/text chain value.

<input id="value" /> <div id="show"></div> 

$('#value').on('keyup input paste',  function(){    var show=$(this).val().split(',').join('<br/>');     $('#show').html(show); }); 

output :

demo1
demo2

need output :

demo1 <a>clear_button1</a>
demo2 <a>clear_button2</a>

when click on each clear button remove satisfy value input.

try :

<input id="value" /> <div id="show"></div> <script> $('#value').on('keyup input paste',  function(){     var show=$(this).val().split(',');     var temp="";      (i=0; i<show.length; i++)     {         if(show[i]!="")         {             temp += '<div><span>'+show[i]+'</span><a href="#" class="clear">clear</a></div>';         }     }     $('#show').html(temp);  });  $('#show').on('click','.clear',function(){     object.prototype.getkey = function( value ) {     for( var p in ) {         if( this.hasownproperty( p ) ) {              if( this[ p ] === value )                  return p;             }         }     }      var val = $(this).parent().find('span').html();     var temp =$("#value").val();     temp = temp.split(',');     temp = temp.filter(function(v){return v!==''});     var k = temp.getkey(val);     delete temp[k];     temp = temp.filter(function(v){return v!==''});     $("#value").val(temp);     $(this).parent().remove();     $("#value").keyup(); }); </script> 

jsfiddle demo