Utiliser un filtre sur les éléments ne sont pas déjà chargés

Question

J'utilise ce script JQuery pour afficher une seule catégorie d'une liste cachée par css:

<script language="javascript"> 
$(document).ready(function(){ 
    $('span') 
    .filter(function(){ return $(this).text() == 'vendu'; }) 
    .css('display','block'); 
    }); 
</script> 

Il fonctionne très bien pour les éléments déjà chargés.

Existe-t-il un moyen d'appliquer le script sur des éléments qui ne sont pas déjà chargés? Lorsque les utilisateurs vont vers le bas la page du portefeuille, les images suivantes sont le chargement (défilement infini)

Peut-être la fonction .on pourrait faire l'affaire, mais je ne peux pas faire cela fonctionne

Merci pour votre aide ! Je suis tout à fait nouveau dans JQuery alors soyez gentil avec moi;)

Answer 1

Mettez votre code dans une fonction et appeler la fonction de chaque mise à jour de vos éléments

Ex:

<script language="javascript"> 
    function showOnlyOneCategory(){ 
     $('span') 
     .filter(function(){ return $(this).text() == 'vendu'; }) 
     .css('display','block'); 
    } 
    $(document).ready(function(){ 
     showOnlyOneCategory(); // at loading and use it after each update 
    }); 
</script> 

Answer 2

Merci , je trouve enfin une solution satisfaisant:

$(".portfolio-container").bind("DOMSubtreeModified", function() { 
    $('span') 
    .filter(function(){ return $(this).text() == 'vendu'; }) 
    .css('display','block'); 
    }); 

Il applique mon script quand quelque chose change dans le dom