jquery mobile changeチェックボックスの色

Question

他の色をチェックすると、チェックボックスの色（青色）とチェックボックスのアイコンの色（白色）を変更する方法を教えてください。青色用

<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" /> 
 
    <script src="https://code.jquery.com/jquery-1.11.1.min.js"></script> 
 
    <script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> 
 

 
    <form> 
 
     <label> 
 
      <input type="checkbox" name="checkbox-0 ">Check me 
 
     </label> 
 
    </form>

Answer 1

：

.ui-btn.ui-checkbox-on.ui-btn-a:after { 
    background-color: red !important; 
} 

白いアイコンはSVGです：

.ui-icon-check:after { 
    background-image: url(newicon.svg); 
} 

Answer 2

すべてを行う必要が使用されているクラスを識別でjqueryで背景色を変更すると些細なCSSですが、その後、あなたは単にあなたが2色のセットを持っているアイコンの色のために、この

.ui-btn.ui-checkbox-on:after { 
 
    background-color: red !important; 
 
} 
 

 
.ui-btn.ui-checkbox-off:after { 
 
    background-color: blue !important; 
 
}

<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" /> 
 
<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script> 
 
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> 
 

 
<form> 
 
    <label> 
 
      <input type="checkbox" name="checkbox-0 ">Check me 
 
     </label> 
 
</form>