title: move the div upon checkbox checked
body: <p>I am trying to implement a elevator functionality [there are 6 floors and corresponding<br>
     to each one , there is a checkbox. Depending upon which checkbox is checked, the elevator<br>
     shud move to that floor.  </p>
  
  <p>But the functionality somehow seems to be not working.</p>
  
  <p>Here is my HTMl markup with embedded jquery script:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
      &lt;html&gt;
          &lt;head&gt;
              &lt;title&gt;Sample Page&lt;/title&gt;
              &lt;link rel="stylesheet" type="text/css" href="main.css"&gt;
      &lt;script src="jquery.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script language="javascript" type="text/javascript"&gt;
  
      $('.container input').change(function(){
      if ($(this).is(':checked')){
              if ($('div.activeDiv')[0]) {
             $(".blockdiv&gt;div").removeClass("activeDiv");}
             $(this).closest('.blockdiv .inactiveDiv').addClass("activeDiv");
      }
      });
  
      &lt;/script&gt;
      &lt;style&gt; .blockDiv {   
      width: 60px;
      height: 60px;
      background: #0000FF;
      border: 2px solid #000;
  }
  
  .activeDiv{
      width: 45px;
      height: 45px;
      background: #FFAC00;
      margin-left: 8px;
      margin-top: 8px;
  }
  .inactiveDiv{
      background: #0000FF;
  }&lt;/style&gt;
          &lt;/head&gt;
          &lt;body&gt;
              &lt;div&gt;
              &lt;div class="container"&gt;
                  &lt;div class="blockDiv"&gt;
                      &lt;div class="inactiveDiv"&gt;&lt;/div&gt;
                  &lt;/div&gt;            
              &lt;input type="checkbox" name="floorCheck" value="fifthFloor"/&gt;
              &lt;/div&gt;
              &lt;div class="container"&gt;
                  &lt;div class="blockDiv"&gt;
                      &lt;div class="inactiveDiv"&gt;&lt;/div&gt;
                  &lt;/div&gt;
                  &lt;input type="checkbox" name="floorCheck" value="fourthFloor"/&gt;
              &lt;/div&gt;
              &lt;div class="container"&gt;
                  &lt;div class="blockDiv"&gt;
                      &lt;div class="inactiveDiv"&gt;&lt;/div&gt;
                  &lt;/div&gt;
                  &lt;input type="checkbox" name="floorCheck" value="thirdFloor"/&gt;
              &lt;/div&gt;
              &lt;div class="container"&gt;
                  &lt;div class="blockDiv"&gt;
                      &lt;div class="inactiveDiv"&gt;&lt;/div&gt;
                  &lt;/div&gt;
                  &lt;input type="checkbox" name="floorCheck" value="secondFloor"/&gt;
              &lt;/div&gt;
              &lt;div class="container"&gt;
                  &lt;div class="blockDiv"&gt;
                      &lt;div class="inactiveDiv"&gt;&lt;/div&gt;
                  &lt;/div&gt;
                  &lt;input type="checkbox" name="floorCheck" value="firstFloor"/&gt;
              &lt;/div&gt;
              &lt;div class="container"&gt;
                  &lt;div class="blockDiv"&gt;
                      &lt;div class="activeDiv"&gt;&lt;/div&gt;
                  &lt;/div&gt;
                  &lt;input type="checkbox" name="floorCheck" value="groundFloor"/&gt;
              &lt;/div&gt;
              &lt;/div&gt;
          &lt;/body&gt;
      &lt;/html&gt;
  </code></pre>