title: Css style radio button not working when checked Django
body: <p>I have that HTML:</p>
  
  <pre><code>&lt;span class="label-text"&gt;&lt;/span&gt;&lt;ul id="id_stars"&gt;
  &lt;li&gt;&lt;label for="id_stars_0"&gt;&lt;input class="star-field" id="id_stars_0" name="stars" type="radio" value="1" /&gt; 1&lt;/label&gt;&lt;/li&gt;
  &lt;li&gt;&lt;label for="id_stars_1"&gt;&lt;input class="star-field" id="id_stars_1" name="stars" type="radio" value="2" /&gt; 2&lt;/label&gt;&lt;/li&gt;
  &lt;li&gt;&lt;label for="id_stars_2"&gt;&lt;input class="star-field" id="id_stars_2" name="stars" type="radio" value="3" /&gt; 3&lt;/label&gt;&lt;/li&gt;
  &lt;li&gt;&lt;label for="id_stars_3"&gt;&lt;input class="star-field" id="id_stars_3" name="stars" type="radio" value="4" /&gt; 4&lt;/label&gt;&lt;/li&gt;
  &lt;li&gt;&lt;label for="id_stars_4"&gt;&lt;input class="star-field" id="id_stars_4" name="stars" type="radio" value="5" /&gt; 5&lt;/label&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>And I have that CSS:</p>
  
  <pre><code>#id_stars{
    list-style: none;
  }
  
  #id_stars label{
    font-weight: normal;
  }
  
  #id_stars input[type=radio]{
    display: none;
  }
  
  #id_stars label{
    width: 15px;
    height: 15px;
    margin: 0 0 0 5px;
    cursor: pointer;
    border: 0px;
    border-radius: 2px;
    background-color: #C1C1C1;
  }
  
  input[type=radio]:checked + label{
    background: #F79414;
  }
  </code></pre>
  
  <p>When the radio field is cheked, the color of the label is not changing.</p>
  
  <p>Any idea?</p>
  
  <p>Bonus question: How could I do custom a custom radio button near the label without touching the HTML code (generated by Django forms), instead of modifying the label like now? </p>