[Problem] jQuery click event with represent wrong values from Eloquent

I'm pretty much new to jQuery and I'm still testing the water. So with that I whipped out an example of when a user clicks a button tag, a jQuery UI dialog will prompt out with two button (Ok and Cancel).

Now this ui-dialog will be generated with different values from Eloquent, this value will then be stored in the 'OK' button located inside of the ui-dialog, however there's a problem..

So say there are 5 rows of result in the database. In the code below using the for loop, it will generate 5 buttons, each representing their respective rows. No matter which OK button i clicked in the UI dialog of any buttons generated, it will always be the value of the first result from the query. following by second, third and so on..

How can I generate the window.location.href value where it represent exactly the row it represents?

<tbody>
@foreach($Bookings as $Booking)
$(document).ready(function(){
$("tbody").delegate("#btn-accept", "click", (function() {
    $("<div>Hey, thanks for clicking me!</div>").dialog({
        modal: true,
        resizable: false,
        width: 450,
        title: "Greetings users!",
        buttons: {
            "Ok": function() {
                window.location.href='/clickme/{{ $Booking->id }}/accept';
            },
            Cancel: function() {
                $( this ).dialog( "close" );
            }
        },
        position: {
            my: "center",
            at: "center",
            of: "#section-panel"
        }
    });
}));
    <button id="btn-accept" type="button">Click Me!</button>                                            
@endforeach
</tbody>