Changer le contenu de div - jQuery

Comment est-il possible de changer le contenu de cette div, quand un des LIENS est cliqué?

<div align="center" id="content-container">
    <a href="#" class="click cgreen">Main Balance</a>
    <a href="#" class="click cgreen">PayPal</a>
    <a href="#" class="click cgreen">AlertPay</a>
</div>

Vous pouvez vous abonner à l'événement .click pour les liens et modifier le contenu du div en utilisant la .htmlméthode:

$('.click').click(function() {
    // get the contents of the link that was clicked
    var linkText = $(this).text();

    // replace the contents of the div with the link text
    $('#content-container').html(linkText);

    // cancel the default action of the link by returning false
    return false;
});

Notez cependant que si vous remplacez le contenu de ce div, le gestionnaire de clics que vous avez attribué sera détruit. Si vous avez l'intention d'injecter de nouveaux éléments DOM à l'intérieur du div pour lesquels vous devez attacher des gestionnaires d'événements, ces pièces jointes doivent être effectuées dans le gestionnaire .click après avoir inséré le nouveau contenu. Si le sélecteur d'origine de l'événement est conservé, vous pouvez également jeter un œil à la .delegateméthode pour attacher le gestionnaire.

Il y a 2 fonctions jQuery que vous voudrez utiliser ici.

1) click. Cela prendra une fonction anonyme comme seul paramètre, et l'exécutera lorsque vous cliquerez sur l'élément.

2) html. Cela prendra une chaîne html comme seul paramètre, et remplacera le contenu de votre élément par le html fourni.

Donc, dans votre cas, vous voudrez faire ce qui suit:

$('#content-container a').click(function(e){
    $(this).parent().html('<a href="#">I\'m a new link</a>');
    e.preventDefault();
});

Si vous souhaitez uniquement ajouter du contenu à votre div, plutôt que de tout remplacer, vous devez utiliser append:

$('#content-container a').click(function(e){
    $(this).parent().append('<a href="#">I\'m a new link</a>');
    e.preventDefault();
});

Si vous souhaitez que les nouveaux liens ajoutés ajoutent également un nouveau contenu lorsque vous cliquez dessus, vous devez utiliser la délégation d'événements :

$('#content-container').on('click', 'a', function(e){
    $(this).parent().append('<a href="#">I\'m a new link</a>');
    e.preventDefault();
});

$('a').click(function(){
 $('#content-container').html('My content here :-)');
});

Vous pouvez essayer la même chose avec replacewith ()

$('.click').click(function() {
    // get the contents of the link that was clicked
    var linkText = $(this).text();

    // replace the contents of the div with the link text
    $('#content-container').replaceWith(linkText);

    // cancel the default action of the link by returning false
    return false;
});

La .replaceWith()méthode supprime le contenu du DOM et insère un nouveau contenu à sa place en un seul appel.

Essayez ceci pour changer le contenu de div en utilisant jQuery.

Voir plus @ Modifier le contenu de div en utilisant jQuery

$(document).ready(function(){
    $("#Textarea").keyup(function(){
        // Getting the current value of textarea
        var currentText = $(this).val();

        // Setting the Div content
        $(".output").text(currentText);
    });
});

Essayer $('#score_here').html=total;