title: How to change the font color of the orderlist when a checkbox is selected?
body: <p>I am developing the list with check and uncheck box for the carlist and list was in array and i am not able change the font color in list using angularjs and html</p>
  
  <p>this is like to do list option page the car list will have yes and no check box but when i tried to check and uncheck it was working for the first object in the list please help me to do the same in the list</p>
  
  <pre><code>&lt;div ng-app="myApp" ng-controller="orderCtrl"&gt;
  &lt;ul style="list-style-type:none"&gt;
  &lt;li id="list" ng-repeat="x in cars | orderBy"&gt;
     &lt;input type="checkbox" id="selected" ng-model="cars[x]" onchange="changeColor()"/&gt; 
     &lt;input type="checkbox" id="nonSelected" onchange="changeColor()"/&gt;{{x}}&lt;/li&gt;
  &lt;/ul&gt;
  &lt;/div&gt;
  
  &lt;script&gt;
  var app = angular.module('myApp', []);
  app.controller('orderCtrl', function($scope) {
      $scope.cars = ["Porsche", "Bentley", "Audi", "Ferrari", "BMW", "Ford"];
  });
  function changeColor()
  {
      if(document.getElementById("nonSelected").checked==true){
          document.getElementById("list").style.color="red";
          document.getElementById("selected").disabled = true;
          return;
      }
      else if(document.getElementById("selected").checked==true){
          document.getElementById("list").style.color="green";
          document.getElementById("nonSelected").disabled = true;
          return;
      } else {
          document.getElementById("list").style.color="black";
          document.getElementById("selected").disabled = false;
          document.getElementById("nonSelected").disabled = false;
          return;
      }
  
  }
  &lt;/script&gt;
  </code></pre>
  
  <p>results must be list when i selected the checkbox the list font must change the color and another check box should disabled in the array list</p>