Why does button id not show for content added to a div with JQuery?

Question

I want to be able to show the id of a button that is clicked. In the following I have 2 buttons. The first is my original html and the 2nd is added using JQuery. The first button shows its id when clicked but the 2nd does not. What is wrong here?

HTML

<div id="box1">
  <button id="So">Yo</button>  
</div>

JS

var anotherButton='<button id="Fat">Mamma</button>';        

("button").click(function() {
  alert($(this).attr('id'));
});

$("#box1").append(anotherButton);