Jquery change le CSS de l'enfant après clone - jquery, css, html, clone

Après avoir clone une DIV et que je puisse la changer, cpropriétés, mais ne "trouve pas comment changer" le CSS de son enfant DIV. Dans l'exemple suivant, je souhaite changer le fond de # details-child du jaune au bleu. CSS:

#wrapper {
width:200px;
background:gray;
}
#details {
width:200px;
height:100px;
background:green;
}
#details-child {
width:100px;
height:100px;
background:yellow;
}

JS:

jQuery.noConflict();
jQuery(document).ready(function() {
// clone
clone_details = jQuery("#details").clone();

// change CSS
clone_details.css({"margin-top":"50px", "background":"red"});
// jQuery("#details-child").css("background","blue"); // changes original div

// render clone
jQuery("#wrapper").append(clone_details);
});

Réponses:

Une fois que vous avez un objet jQuery, vous pouvez effectuer une recherche par sélection dans le cadre de cet objet avec $.find()

http://api.jquery.com/find/

clone_details.find("#details-child").something();

Cependant, vous ne voulez pas vous retrouver avec des identifiants dupliqués partout. Je vous suggère donc de passer à l’utilisation de classes plutôt que d’ID, car ils doivent être uniques.

Premièrement, si vous clonez des éléments avec des ID, vous devez réellement supprimer ou modifier leur ID. Deuxièmement, cela doit faire ce que vous voulez:

$("#details").clone().removeAttr("id")
.css({"margin-top":"50px", "background":"red"})
.appendTo("#wrapper").children("#details-child")
.removeAttr("id").css({background: "red"});

Enfin, d’une manière générale, je recommanderaisen utilisant des classes plutôt que du CSS brut si possible. De plus, si vous utilisiez une classe telle que "détails", elle correspondrait mieux à la situation (puisque vous en avez plusieurs) et serait plus facile à utiliser.