javascript - Laravel ajax request not working for a foreach loop -

i have collected data in controller.now in view,i have showed them inside unordered list (ul) link.

<ul>     <li><a>....</a></li> </ul> 

now when trying fire ajax request,only last data (i.e,last link in listed items) responding ajax request.the ajax script not inside foreach loop.do have place ajax script inside foreach loop.then,for each data there script.won't create problem?

<ul> @foreach ($brands $brand)      <li class='n1'><a href="{{$brand->id}}"  id="{{$brand->brand}}">{{$brand->brand}}</a></li> @endforeach </ul> 

my ajax script:

<script>  $('#{{$brand->brand}}').on('click',function(e){     e.preventdefault();      $.ajaxsetup({       headers: {           'x-csrf-token': $('meta[name="csrf-token"]').attr('content')       }     });     $.ajax({       type:"post",       url:'/userproduct',       data: { value: $('#{{$brand->brand}}').attr('href')},       success:function(data) {           console.log(data);       }           }); }); </script> 

in controller

public function userproduct(request $request){    $value=$request->input('value');    return response::json($value); } 

imo, {{$brand->brand}} "id" doesn't make sense. can like,
id="product-{{$brand->brand}}"
you're writing $('#{{$brand->brand}}').on('click',function(e){}); means that, you're registering 1 node.

how overcome this?

apply specific class links. register click event class. use, html5 data-* api link , so. that's it.