How to select a button by matching text inside a span

Question

I want to disable the button that appears in the dialog box based on the condition. The problem is, how can I access the button because it is dynamically generated in the dialog box?

The generated html code in the dialog box:

<button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="true"> <span> class="ui-button-text">Save</span> </button> 

Answer 1

I assume there was a typo in your code and you didn’t want to close the span span tag, so your code

 <button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="true"> <span class="ui-button-text">Save</span> </button> 

Then you can change the word “Save” in the next line to any text in the button that you want to hide.

 $("button span:contains('Save')").parent().attr("disabled", true); 

Answer 2

for dynamic generation of DOM u, you can use .live()

Answer 3

You can use jQuery to match attributes:

 $('button[role=button]').attr("disabled", true); 

Answer 4

 $("span:contains('Save')").parent().attr("disabled", true);