CSS funktioniert nicht in einer dynamisch erstellten Seite

Question

Ich bin neu bei JQuery Mobile und versuche, eine einfache App zu erstellen. Ein Teil der Codes wie folgt:

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $(".trycss").css({ 
      'background': 'red' }); 
    $.post("http://getcheckout.php", 
     function(data){ 
      var CheckOutListHTML ='<p class="trycss"> HELLO</p>'; 
       $('.class-ItemsList').append(CheckOutListHTML); 
      },"json"); 
    }); 

</script> 

<div data-role="page" id="id-ItemsPage"> 
    <div data-role="header" data-position="fixed"> 
     <h1>Items</h1> 
    </div><!-- /header --> 
    <div data-role="content"> 
     <div class="class-ItemsList"> 
     </div> 
    </div><!-- /content --> 
</div><!-- /page --> 

Also, ich versuche, die „trycss“ zu Stil etwas, das ich dynamisch erschaffe zu verwenden. Aber es funktioniert nicht. Kann jemand helfen?

Danke.

Answer 1

Versuche folgenden:

<style> 
    .trycss { background-color: red; } 
</style> 
<script type="text/javascript"> 
    $(document).ready(function(){ 
    $.post("http://getcheckout.php", 
     function(data){ 
      var CheckOutListHTML ='<p class="trycss"> HELLO</p>'; 
       $('.class-ItemsList').append(CheckOutListHTML); 
      },"json"); 
    }); 

</script> 

<div data-role="page" id="id-ItemsPage"> 
    <div data-role="header" data-position="fixed"> 
     <h1>Items</h1> 
    </div><!-- /header --> 
    <div data-role="content"> 
     <div class="class-ItemsList"> 
     </div> 
    </div><!-- /content --> 
</div><!-- /page --> 

Answer 2

$(".trycss").css(... einmal ausgeführt und wendet Stile (nicht „ein Stylesheet“) an alle passenden Elemente, die zu diesem Zeitpunkt existieren an Sie Sie nicht erstellen Sie Ihre Element bis später.

Was genau versuchen Sie zu tun? Warum verwendest du $(".trycss").css(... und nicht ein Stylesheet wie @hardik?