Q:

textbox change event doesn't fire using append text using another method

I need to fire an event when change the valueof a textbox using change event. 
html
'<select onchange="ChooseContact(this)">
 <option value='1'>1</option>
 <option value='2'>2</option></select>
 <input id="friendName">'

JS
function ChooseContact(data) {

document.getElementById ("friendName").value = data.value;

}

 $("#friendName").change(function(){
   alert("The text has been."); 
  });

$('#friendName').bind('input propertychange', function() {
       alert("The text has been changed."); 
});

here i tried to change select option value append to text.  it will works fine.  
textbox change event doesn't trigger also tried with input propertychange 
if anybody know the reason please share here. 
I tried

A:

Since you are changing the value programatically, the change event will not get triggered automatically, instead you can trigger it manually

function ChooseContact(data) {
  $('#friendName').val(data.value).change()
}

$("#friendName").change(function() {
  alert("The text has been."); 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select onchange="ChooseContact(this)">
  <option value='1'>1</option>
  <option value='2'>2</option>
</select>
<input id="friendName">

