javascript - getting name attribute dynamically using jquery -

i have div block trying find name of input element clicked , update value using jquery:

$(document).ready(function(){    $(this).click(function(){      console.log($(this).attr('name'));    });  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>    <div>    <input type="text" name="name1" id="id1">testdata1</input>  <input type="text" name="name2" id="id2">testdata2</input>  </div>

when try find input element clicked undefined.

i assuming may because checking click event on , again trying attr name of it, since can increase @ least 5 input elements , these being fetched dynamically, cannot bind id/class click event.

the this has no context inside ready function :

$(this).click(function(){ _^^^^^___________________    console.log($(this).attr('name')); }); 

you should use input :

$('input').click(function(){    console.log($(this).attr('name')); }); 

note : input tag self closed :

<input type="text" name="name1" id="id1" value='testdata1'/> <input type="text" name="name2" id="id2" value='testdata2'/> 

i hope helps.

$(document).ready(function(){    $('input').click(function(){      console.log($(this).attr('name'));    });  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>    <div>    <input type="text" name="name1" id="id1" value='testdata1'/>  <input type="text" name="name2" id="id2" value='testdata2'/>  </div>