jQuery event keyup to change html() of other element not working properly -

i'm trying change text inside <span> when data entered related <input> field. i'm using following script.

jquery(".selector").live({     'paste keyup input' : function () {         var val = $(this).val();         var dest_class = $(this).attr('class') + '_' + $(this).attr('dest');         $('.' + dest_class).html(val);     },     change: function () {         var id = $(this).attr('id') + " option:selected";         var val = $("#" + id).text();         var dest_class = $(this).attr('class') + '_' + $(this).attr('dest');         $('.' + dest_class).html(val);     } }); 

the code working properly. problem i'm facing first event. when listed occurring in <input class="cell_value" ...> html of destination changing should, moment click outside or press tab changes made destination <span> disappears.

if press enter value stays in destination untill edit input again.

the second event i.e. "change" working fine.

any suggestion i'm doing wrong.

here fiddle link http://jsfiddle.net/k6ru4/1/

it because of selector, fires change event in both input , select elements, change event handler designed handle input element problem

$(".selector").live({     'paste keyup input change' : function () {         var val, $this = $(this);           if($this.is('select')){             val = $this.find('option:selected').text();         } else {             val = $this.val();         }          var dest_class = $(this).attr('class') + '_' + $(this).attr('dest');         $('.' + dest_class).html(val);     } }); 

demo: fiddle