title: Dynamically change the color of div according to database
body: <p>I want to have a webpage with small boxes which indicate a color according to the value in database. For example: if status is busy in database, the div color is red and so on.</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;tr&gt;
      &lt;td class="dclass"&gt;
          &lt;div id="l1r1" class="top"&gt;&lt;/div&gt;                   
          &lt;div id="l1r2" class="top"&gt;&lt;/div&gt;
          &lt;div id="l1r3" class="bottom"&gt;&lt;/div&gt;
          &lt;div id="l1r4" class="bottom"&gt;&lt;/div&gt;
      &lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>.top, .bottom 
  {
      height: 8px;
      width: 33%;
      border: 1px solid;
      border-color: black;
      float:left;
      margin:1.2px;
  }
  </code></pre>
  
  <p>Controller:</p>
  
  <pre><code> public class HomeController : Controller
   {       
       public ActionResult Index()
       {             
           MySQL msql = new MySQL();                          
           List&lt;string&gt; status = msql.SelectList("Select status from table");                     
           for (int i = 0; i &lt; status.Count; i++)
           {
               //populate values(color) to div according to the status
           }
           return View();
       }   
  }
  </code></pre>
  
  <p>I want to use the div id in the controller to populate the div and I am not sure how to do that.
  Any suggestions would be appreciated. Thank you.</p>