title: unrecognized jquery element in chrome
body: <p>I have a popup displayed using ajax. This popup contains a form, this is how it looks like.</p>
  
  <pre><code>    &lt;form id="edit_tailored_form" name="thisisthename" method="post" action="/edittailored"&gt;
          &lt;h4&gt;Country&lt;/h4&gt;
          &lt;p&gt;Show only records from this country.&lt;/p&gt;
          &lt;ul&gt;
              &lt;li&gt;&lt;label&gt;Country:&lt;/label&gt;
                  &lt;select class="inpt1" name="country"&gt;
                         &lt;option value="0"&gt;ALL_COUNTRIES&lt;/option&gt;
                         &lt;option value="1"&gt;United States&lt;/option&gt;
                         &lt;option value="2"&gt;France&lt;/option&gt;
                  &lt;/select&gt;
              &lt;/li&gt;
          &lt;/ul&gt;
          &lt;h4&gt;Hashtags&lt;/h4&gt;
          &lt;div class="clr" style="height:10px;"&gt;&lt;/div&gt;
          &lt;p&gt;Show only records under these hashtags.&lt;/p&gt;
          &lt;ul&gt;
              &lt;li&gt;&lt;label&gt;Hashtags:&lt;/label&gt;&lt;input type="text" name="hashtags_select" class="hashtags_select inpt1"&gt;
  
                  &lt;a href="javascript:void(0);" class="add_btn" id="addhash_lst"&gt;+&lt;/a&gt;
                  &lt;input type="hidden" class="cid" value="" /&gt;
                  &lt;div class="hashtags_list"&gt;&lt;/div&gt;&lt;/li&gt;
              &lt;li&gt;&lt;label&gt;&amp;nbsp;&lt;/label&gt;
  
                  &lt;div class="hashtags_display"&gt;
                      &lt;ul&gt;
                          &lt;!-- display here the added hashtags---&gt;
                      &lt;/ul&gt;
                  &lt;/div&gt;
                  &lt;input type="hidden" name="hashtags" class="hashtags_hdn" value="1,3,13"&gt;
          &lt;/ul&gt;
          &lt;div class="clr" style="height:0px;"&gt;&lt;/div&gt;
          &lt;h4&gt;Save and quit&lt;/h4&gt;
          Save the modification and quit.
          &lt;ul&gt;
              &lt;li&gt;&lt;label class="control_label"&gt;&amp;nbsp;&lt;/label&gt;&lt;a href="javascript:void(0);" class="close_popup"&gt;&amp;nbsp;&lt;/a&gt;&amp;nbsp;&amp;nbsp;&lt;input type="button" id="edit_tailored_btn" class="btn1" value="Save" /&gt;&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/form&gt;
  </code></pre>
  
  <p>And in the javascript file, I added this action:</p>
  
  <pre><code>$('#edit_tailored_btn').live('click', function(event) {
  
          event.preventDefault();
          event.stopPropagation();
          var data = $('#edit_tailored_form').serialize();
          $.ajax({
              url: '/edittailored',
              data: data + '&amp;ajx=2',
              type: 'post',
              success: function(data) {
                  $('#add_record_wrapper').html(data);
              }
          });
      })
  </code></pre>
  
  <p>With edit_tailored_btn standing for the Id of the "save" button in the form.</p>
  
  <p>as you can see, I serialize the form to get the data of its inputs so I can send them using ajax (again).</p>
  
  <p>My problem is that the serialize like doesn't work in chrome (it works in firefox). A inspected that and found that it's not actually serialize which is not working, but my form is not recognized, as for <code>alert($('#edit_tailored_form').attr('name'));</code> displaying null.</p>
  
  <p>Any idea?</p>