**Laravel View code:**

```
<div class="col-sm-12">
@foreach($deviceCategory as $deviceCategories)
<div class="col-sm-4">
<div class="panel panel-default">
 <div class="panel-heading">
 <div class="col-sm-1">
 <div id="deviceId" class="check">{{$deviceCategories-
 >deviceCategoryId}}</div>
 </div>
  <br/> 
 </div>
<div class="panel-body">
<div class="col-sm-2">
<h5><strong>{{$deviceCategories->deviceCategoryName}}</strong></h5>
<h6><button style="border:none; background-color: transparent;" 
disabled></button></h6>
 </div>
 <div class="col-sm-1" align="center">
 <img src="{{asset(Storage::url('public/' . $deviceCategories-
 >image))}}" width="200" height="150">

 </div>
  </div>
 <div class="panel-footer" align="right"><a href="" data-
 toggle="modal" data-target="#myModal" 
 class="getDeviceCategoryId">SELL THIS CATEGORY</a></div>
 </div>
 </div>
 @endforeach
 </div>

```

This is my view code. Here I am displaying the values dynamically that are fetched from db. Then When I click with the panel-footer (ie.,SELL THIS CATEGORY) , I need to alert the respective value in the panel-heading(ie.,{{$deviceCategories->deviceCategoryId}})

**SCRIPT CODE**

```
 <script type="text/javascript">

   $(document).ready(function() {
   $('.getDeviceCategoryId').click(function() {
    var value=$('#deviceId').text();
   alert(value);

  });
  });

```

This is my script code I have tried. But I get only the first id value for all panel footers.