title: How to select HTML structure without an id
body: <p>I have the following HTML:</p>
  
  <pre><code>    &lt;button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button"&gt;
        &lt;span class="ui-button-text"&gt;New&lt;/span&gt;
      &lt;/button&gt;
  </code></pre>
  
  <p>This is a button that is created automatically when creating a dialog.  I've tried adding an 'id' in the dialog definition, but this results in a query error.</p>
  
  <pre><code>    $("#createDept").dialog({modal:true
                          ,draggable:true
                          ,resizable:false
                           ,position:{my:"center"
                                     ,at:"center"
                                     ,of:window}
                               ,show:"blind"
                               ,hide:"blind"
                             ,height:204
                              ,width:232
                        ,dialogClass:"ui-dialog-osx"
                            ,buttons:{"New":fnClearAllFields
                                        ,id:"btnEdit"
                                  ,"Submit":function() {
      ...
      }});
  </code></pre>
  
  <p>The error I get is:</p>
  
  <pre><code>    setAttribute — jquery-2.2.1.min.js:3:30983InvalidCharacterError (DOM Exception 5): The string contains invalid characters.
  </code></pre>
  
  <p>So the question is, how can I select the HTML and remove it based on the span content being equal to "New" ?</p>
  
  <p>[Edit]..I can see that the buttons reference is assigned two buttons New and Submit, which I did some time ago and completely forgot about it, so the id is completely in the wrong place.</p>
  
  <p>How do I add an id to the 'New' button ?</p>
  
  <p>I tried:</p>
  
  <pre><code>    ,buttons:{"New"{click:fnClearAllFields 
                        ,id:"btnEdit"}}
  </code></pre>
  
  <p>But this doesn't work.</p>