JavaScript obtenir de l'élément parent et écrire titulaire de la div pour les frères et sœurs

Je avoir la structure suivante:

<div class="parent">
  <div id="child1">Content here</div>
  <div class="child2">Content here</div>
</div>

À onload, je veux inclure un "titulaire" de la div, qui détient tous les enfants du parent comme suit:

<div class="parent">
  <div id="holder">
    <div id="child1">Content here</div>
    <div class="child2">Content here</div>
  </div>
</div>

Sachant que le "enfant1" id, comment puis-je ajouter un titulaire div autour de lui et les frères et sœurs?

Considérations

  • La "enfant1" id est le seul identifiant.
  • La classe "parent" et "enfant2" sont dynamiques et nom et changement, ne peut donc pas être utilisés comme identificateurs.
  • doit être de vanille JavaScript.

Pensées?

A votre question à l'origine un jQuery balise et de ne pas dire "à la vanille JavaScript"? Je me demandais depuis que vous avez eu tant de jQuery réponses (de moi) et je suis sûr qu'il a mentionné jQuery quelque part à la fois, j'ai répondu!
Désolé James, je n'ai pas parler de JQuery. (Mon post n'a pas été modifié depuis)

OriginalL'auteur mika.el | 2012-07-05

  1. 24

    Vu que c'est à JavaScript (et pas jQuery) et vous ne pouvez identifier l'enfant1 par l'id que vous pourriez faire quelque chose d'aussi simple que ceci:

    var child1 = document.getElementById("child1"),
    parent = child1.parentNode,
    contents = parent.innerHTML ;
    parent.innerHTML = '<div id="holder">' + contents + '</div>';

    Espère que cela aide...

    +1 pour être le seul à remarquer "doit être à la vanille JavaScript"! Je suis sûr que ce point n'était pas là quand la question est posée, bien que...
    Quelqu'un qui a supprimé 🙁
    Oui, .innerHTML est brut.
    Mais est-ce à vous donner la réponse. Pourquoi pensez-vous innerHTML est brut?
    Je ne suis pas si sûr que comme lors du test j'ai ajouté une image externe de l'enfant1 div et il ne charge avant de repeindre (en utilisant innerHTML). Aussi, vous n'avez pas mentionné que, dans l'original de votre problème...

    OriginalL'auteur Mike Sav

  2. 2

    Il a dit pas de jQuery, cela sonne comme un devoir à la maison mais:

    var el = document.getElementById('child1');
var parent = el.parentNode;
parent.innerHTML = '<div id="holder">' + parent.innerHTML + '</div>';

    OriginalL'auteur anteatersa