.on event is not working while element is dynamically generated
<h2>HTML</h2>

<pre><code>&lt;a href="javascript:;"&gt;UPDATE&lt;/a&gt;
</code></pre>

<h2>JQUERY</h2>

<pre><code>$(document).ready(function(){
  var b = '&lt;input type="text" name="fullname"&gt;&lt;br&gt;'+
          '&lt;input type="text" name="email"&gt;';
  $('a').click(function(){
    $("a ~ input, a ~ br").remove();
    $("body").append(b);
  });
  $('input').on({
    focus: function(){
      $(this).css("background","#ccc");
    },
    blur: function(){
      $(this).css("background","#fff");
    }
  });
});
</code></pre>

<p>.on() event is not working while i generated input dynamically.</p>
