Two or more fields with Typeahead.js

I'm having a problem with typeahead function in one of my blade. I have a function that add more fields dynamically, and the typeahead work only on first input. I know a missing something on script, but i don't know how to do :D

Here is my typeahead script:

  <script type="text/javascript">
      var path = "";
       $('input.typeahead').typeahead({
      source: function (query, process) {
      return $.get(path, { query: query }, function (data) {
        return process(data);
        });
      }
   });
  </script>

Here my add fields function:

  <script type="text/javascript">
     $(document).ready(function(){      
       var postURL = "<?php echo url('addmore'); ?>";
       var i=1;  
       $('#add').click(function(){  
        i++;  
        $('#dynamic_field').append('<tr id="row'+i+'" class="dynamic-added"><td><input type="text" name="application[]" id="application" placeholder="Nome da Aplicação" class="typeahead spinner-input form-control application_list" ><td><input type="text" name="version[]" class="form-control application_list" placeholder="Versão"></td><td width="100px"><button type="button" name="remove" id="'+i+'" class="btn btn-danger btn_remove">X</button></td></tr>');  
      });  

       $(document).on('click', '.btn_remove', function(){  
        var button_id = $(this).attr("id");   
        $('#row'+button_id+'').remove();  
      });           

       $.ajaxSetup({
         headers: {
           'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
         }
       });         

       $('#submit').click(function(){            
        $.ajax({  
         url:postURL,  
         method:"POST",  
         data:$('#add_application').serialize(),
         type:'json',
         success:function(data)  
         {
           if(data.error){
             printErrorMsg(data.error);
           }else{
             i=1;
             $('.dynamic-added').remove();
             $('#add_application')[0].reset();
             $(".print-success-msg").find("ul").html('');
             $(".print-success-msg").css('display','block');
             $(".print-error-msg").css('display','none');
             $(".print-success-msg").find("ul").append('<li>Record Inserted Successfully.</li>');
           }
         }  
       });  
      });  
       function printErrorMsg (msg) {
        $(".print-error-msg").find("ul").html('');
        $(".print-error-msg").css('display','block');
        $(".print-success-msg").css('display','none');
        $.each( msg, function( key, value ) {
         $(".print-error-msg").find("ul").append('<li>'+value+'</li>');
       });
      }
     });  
  </script>

And here is my Controller:

public function autocomplete(Request $request)
{
    $datas = SoftwareList::where("application","LIKE","%{$request->input('query')}%")->get();
    $dataModified = array();
     foreach ($datas as $data)
     {
       $dataModified[] = $data->application;
     }

    return response()->json($dataModified);
}

Thanks advance!

via Chebli Mohamed