title: jquery selectors not working when used with # for id, but working with div[id="theid"]
body: <p>here is the situation the html</p>
  
  <pre><code>&lt;div id="editUser-0" style="display: none;"&gt;
      &lt;form action="/admin/uactions.php" method="post" enctype="multipart/form-data" class="form-horizontal" id="userEditorForm-0"&gt;
      &lt;input type="hidden" name="id" id="id" value="0" /&gt;
      &lt;input type="hidden" name="action" id="action" value="edituser" /&gt;
      &lt;div class="control-group"&gt;
          &lt;label class="control-label" for="name"&gt;Име&lt;/label&gt;
          &lt;div class="controls"&gt;
              &lt;input type="text"  id="name-0" name="name" class="validate[required]" placeholder="Име" value=""&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="control-group" &gt;
          &lt;label class="control-label" for="email-0"&gt;Имейл&lt;/label&gt;
          &lt;div class="controls"&gt;
              &lt;input type="text" id="email-0" class="validate[required,custom[email]]" name="email" placeholder="Имейл" value=""&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="control-group"&gt;
          &lt;label class="control-label" for="type-0" &gt;Тип&lt;/label&gt;
          &lt;div class="controls"&gt;
              &lt;select name="type" id="type-0"&gt;
                  &lt;option value="1" &gt;Администратор&lt;/option&gt;
                  &lt;option value="100" &gt;Потребител&lt;/option&gt;
              &lt;/select&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="control-group hidden" id="avatarWarper-0"&gt;
          &lt;label class="control-label" for="avatar-0"&gt;Снимка&lt;/label&gt;
          &lt;div class="controls"&gt;
              &lt;input type="file" name="avatar" id="avatar-0" /&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="control-group"&gt;
          &lt;label class="control-label" for="typeinvestor-0"&gt;Тип инвеститор&lt;/label&gt;
          &lt;div class="controls"&gt;
              &lt;select name="typeinvestor" id="typeinvestor-0" &gt;
                  &lt;option value="0"&gt;-&lt;/option&gt;
                  &lt;option value="1"&gt;Investor type 1&lt;/option&gt;
                  &lt;option value="2"&gt;Investor type 2&lt;/option&gt;
                  &lt;option value="3"&gt;Investor type 3&lt;/option&gt;
              &lt;/select&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="control-group"&gt;
          &lt;label class="control-label" for="phone-0" &gt;Телефон&lt;/label&gt;
          &lt;div class="controls"&gt;
              &lt;input type="text" id="phone-0" name="phone" placeholder="Телефон" class="validate[required]" value=""&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="control-group"&gt;
          &lt;label class="control-label" for="country-0"&gt;Държава&lt;/label&gt;
          &lt;div class="controls"&gt;
              &lt;select name="country" id="country-0" class="validate[required]"&gt;
                  &lt;option value="ZW"&gt;Zimbabwe&lt;/option&gt;
              &lt;/select&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;/form&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and here is the javascript</p>
  
  <pre><code>function editUser(id) {
    title = "Change user";
    if (id === 0)
      title = 'New user';
  
    $('&lt;div&gt;' + $('#editUser-' + id).html() + '&lt;/div&gt;').dialog({
      modal: true,
      width: 450,
      title: title,
      buttons: {
        'Save': function() {
  
          $('#userEditorForm-'+id).validationEngine('attach',{promptPosition : "inline", scroll: true});
  
          if($('#userEditorForm-'+id).validationEngine('validate')){
            $('#userEditorForm-'+id).submit();
          }
  
        },
        'Cancel': function() {
          $(this).dialog('close');
          return false;
        }
      },
      open: function(event, ui) {
         $('.ui-dialog :button').blur();
        $("select[id='type-"+id+"']").click(function(){
          if($(this).val()==1){
            $("div[id='avatarWarper-"+id+"']").removeClass('hidden');
          }else{
             $("div[id='avatarWarper-"+id+"']").addClass('hidden');
          }
        });
       $('#type-'+id).click();
      },
      close: function(event, ui) {
  
        $(this).dialog('destroy');
        $(this).remove();
  
      }
    });
  }
  </code></pre>
  
  <p>the problem is, when i use <code>$("div[id='avatarWarper-"+id+"']").click(function(){})</code> it works but when i try to use  <code>$("#avatarWarper-"+id).click(function(){});</code> and this is only when in the open event of the dialog, but for example the submit and validate works both ways. </p>