I have this html code

```
<div class="gallery__item set-bg">
<img class="card-img-top" src="{{asset($template->image_path)}}" alt="" data-value="image-value">
<input type="hidden" id="image-value" name="selected_image" value="{{$template->id}}">
</div>

```

which rendered to this html

```
<img class="card-img-top highlighted" src="http://someurl.test/templates//1 (14).jpg" alt="" data-value="image-value">
<input type="hidden" id="image-value" name="selected_image" value="6">
</div>

```

I use this jquery

```
$('#select-form img').click(function() {
// Set the form value
$('#image-value').val($(this).attr('data-value'));

// Unhighlight all the images
$('#select-form img').removeClass('highlighted');

// Highlight the newly selected image
$(this).addClass('highlighted');
});
</script>

```

this is my laravel function

```
 // post template data
    public function postTemplate(Request $request)
    {
        $selected_image = $request->selected_image;
        dd($selected_image);

    }

```

the problem is the `$selected_image` always obtain the highest value in the page, what did I do wrong? and how to fix this please? thank you

note:the value on the html already change as expected if clicked

any clue will help..