ajax – Passing data-dialog-options and data-dialog-type dynamically to a tag not opening modal

I’m trying to create a dynamic way to open a modal window in drupal. The current structure work like this.

<a class="use-ajax" href="http://drupal.stackexchange.com/node/810">Testing 1 </a>

For that to work and open the modal, I had to add via inline

data-dialog-options="{&quot;width&quot;:800}" data-dialog-type="modal"

What I want is to add the data-dialog-options and data-dialog-type dynamically when the use-ajax class is added to the element.

I tried:

jQuery(document).ready(function() { 
    $('.use-ajax').attr({
        "data-dialog-options":'{&quot;width&quot;:800}', 
        "data-dialog-type":"modal"
    });
});

And even thou it added the attributes to the tag, it is not opening the modal:

<a class="use-ajax" data-dialog-options="{&quot;width&quot;:800}" data-dialog-type="modal" href="http://drupal.stackexchange.com/node/810">Testing 1 </a>```