jQuery setting attribute on click does not change the value
<p>Well i'm not really a guru in jQuery but i can do some basic stuff. However i can't get the point here. I'm listening to <code>.btn-delete</code> <code>click</code> event, setting <code>.btn-danger</code> <code>data-route</code> attribute (in the modal dialog) to the value of <code>.btn-delete</code> <code>data-route</code> attribute.</p>

<p>Really simple stuff, I know i'm doing it wrong. The <strong>value</strong> of <code>data-route</code> for <code>.btn-danger</code> <strong>does not change</strong>. Any help would be much appreciated, thanks.</p>

<pre><code>&lt;!-- modal confirm --&gt;
&lt;div id="modal-delete"&gt;
    &lt;a class="btn-danger" data-route=""&gt;Confirm&lt;/a&gt;
&lt;/div&gt;

&lt;!-- delete buttons --&gt;
&lt;a class="bt-delete" data-route="/user/delete/1"&gt;Delete&lt;/a&gt;
&lt;a class="bt-delete" data-route="/user/delete/2"&gt;Delete&lt;/a&gt;

&lt;script&gt;
     $(document).ready(function() {

         // Listen to .btn-delete click
         $('.btn-delete').click(function() {

             // Get data-route for the delete button and set it in the modal
             $('#modal-delete .btn-danger')
                 .attr('data-route', $(this).data('ruote'));

             // Do ajax in .btn-danger click event
             $('#modal-delete .btn-danger').click(function() {
                 // data-route does not change
                 console.log($(this).data('route'));
             });
         });
     });
&lt;/script&gt;
</code></pre>
