Cómo unir dos objetos de elemento jQuery? .add() no funciona

Question

Estoy dentro de una función y necesito devolver un objeto jQuery con dos elementos. Dentro de la función que tengo, por ejemplo:

function getInput() { 
    $hiddenInput = $('<input type="hidden">'); 
    //(other code) 
    $select = $('<select></select>'); 
    //(other code) 
    $hiddenInput.add($select); 
    return $hiddenInput; 
} 

Y fuera tengo:

$myContainer.append(getInput()); 

El resultado esperado sería:

<div id="container"><input type="hidden"><select></select></div> 

Pero lo único que consigue en este momento con .add() es solo el elemento de entrada y no el de selección. ¿Cómo puedo unir esos dos elementos de formulario en el retorno de la función? Si no es posible con jQuery, entonces con JavaScript simple. Muchas gracias.

Answer 1

add() crea (y devuelve) un nuevo objeto jQuery que es la unión del conjunto original y lo que está agregando a él, pero todavía está devolviendo el original en su función. Parece que han querido hacer esto en su lugar:

function getInput() { 
    $hiddenInput = $('<input type="hidden">'); 
    //(other code) 
    $select = $('<select></select>'); 
    //(other code) 
    return $hiddenInput.add($select); 
} 

Answer 2

Puede utilizar

$hiddenInput.after($select); 

que pondrá el $select después de la $hiddenInput, lograr lo que se quiere conseguir.

Answer 3

Usted puede usar la siguiente:

this.MergejQueryObjects = function(arrayOfJqueryObjects) { 
     return $($.map(arrayOfJqueryObjects, function (el) { 
      return el.get(); 
     })); 
    }