Jquery Modal et styles css

Question

Je souhaite définir la couleur d'arrière-plan de tous les éléments d'une boîte de dialogue ayant une classe de matchedOn.

I ont le code ci-dessous:

$('.matchedOn').each(function() { 
    if ($(this).html() == matchedItem) { 
    $(this).css({ "color": "green", "background-color": "#FFFF00" }); 
    } 
}); 

matchedItem est une variable locale qui est utilisé pour vérifier le contenu de l'élément. Ainsi, par exemple, si un élément avec une classe de matchedOn, contient 'Fred', où 'Fred' est matchedItem, alors définissez le css neccessary.

Cela fonctionne très bien pour le premier onglet de mon modal. Cependant, même si j'ai la classe définie sur le deuxième onglet, avec 'Fred' le CSS n'est pas appliqué.

J'ai le code jquery, après tout html est dessiné à la modale, donc ce n'est pas un problème de vérification contre quelque chose qui n'est pas là.

* EDIT ** salut c'est des données sensibles, donc je ne peux pas tout afficher. Cependant, chaque onglet les éléments suivants sont

<div id="tab6"> 
      <div id="results1"> 
       <div class="message"> 
        <h2>title</h2> 
        <pre> 
        <dl> 
        <dt>Heading</dt> 
        <dd class="matchedOn">Fred</dd> 
        </dl> 
        </pre> 
       </div> 
      </div> 
     </div> 
     <div id="tab7"> 
      <div id="results2"> 
       <div class="message"> 
        <h2>title</h2> 
        <pre> 
        <dl> 
        <dt>Heading</dt> 
        <dd class="matchedOn">Fred</dd> 
        </dl> 
        </pre> 
       </div> 
      </div> 
     </div> 

Donc, dans ma situation, onglet six a le style appliqué, mais pas dans TAB7

Answer 1

Le problème est que votre bloc de code est exécuté une seule fois lorsque les autres onglets sont caché. Votre code devrait également s'exécuter lorsque les autres onglets deviennent actifs afin de changer le CSS sur les éléments visibles. Vous pouvez intercepter l'événement activate et exécuter votre code dans ce:

$('.yourtabdiv').tabs({ 
    activate: function() { 
     $('.matchedOn').each(function() { 
      if($(this).html() == matchedItem) { 
       $(this).css({ "color": "green", "background-color": "#FFFF00" }); 
      } 
     }); 
    }); 

Answer 2

Vérifier:

$('.matchedOn:contains("'+matchedItem+'")').css({ "color": "green", "background-color": "#FFFF00" }); 

Demo