title: Assigning all the attributes of an element to another
body: <p>I have written this code to replace all the elements of a page having a specific data attribute with a dropdown. Let's say if I have had: </p>
  
  <pre><code>&lt;span data-what="partyBox"&gt;&lt;/span&gt;
  </code></pre>
  
  <p>It will be replaced with a dropdown. The code works well but with an exception; later on I wanted to assign all the attributes (for example all the data attributes or anyother assigned ones) of the current tag i.e. the <code>span</code> tag in this case to be assigned to the dropdown that I created. But I am having problem to attain this i.e. it doesn't apply all these attributes to the dropdown. Here is my code:</p>
  
  <pre><code>var mould = {
  
      partyBox        :   $.parseHTML('&lt;select name="mouldedParty"&gt;&lt;option value="-1" selected disabled&gt;Select Party&lt;/option&gt;&lt;/select&gt;'),
  
      init            :   function (){ },
  
      process         :   function (container) {
                              var pBox     = $(mould.partyBox);
                              var pBoxes   = $(container).find('[data-what=partyBox]');
  
                              pBox.css({
                                  'padding'    : '10px',
                                  'border'     : '1px solid #ccc',
                                  'background' : '#368EE0',
                                  'color'      : 'white',
                                  'cursor'     : 'pointer'
                              });
  
                              $(pBoxes).each(function(index, elem){
                                  var attributes = elem.attributes;
                                  var test = $(elem).replaceWith(pBox);
                                  test.attributes = attributes;
  
                              });
  
                              // pBoxes.replaceWith(pBox);
  
                          }
  };
  
  mould.process('body');
  </code></pre>
  
  <p>Can anybody please tell me what's wrong with this code? Why doesn't it apply all the attributes of the span tag to dropdown, although I have used these lines for replacement</p>
  
  <pre><code>            var attributes = elem.attributes;
              var test = $(elem).replaceWith(pBox);
              test.attributes = attributes;
  </code></pre>