CodePen

HTML

            
              <div id="car-map" class="cf">
  <p>Click on an area of the car to 
	indicate its condition.</p>
	
	
	<span id="left-test">
		
	</span>
	<span id="right-test">
		
	</span>
	<div class="region-inputs left-test cf">
		<p>Left Test</p>
		<span><input type="checkbox" value="Scratch">Scratch</span>
		<span><input type="checkbox" value="Dent">Dent</span>
		<span><input type="checkbox" value="Rust">Rust</span>
		<span><input type="checkbox" value="Respray">Respray</span>
		<span><input type="checkbox" value="Crack">Crack</span>
	</div>

	<div class="region-inputs right-test cf">
		<p>Right Test</p>
		<span><input type="checkbox" value="Scratch">Scratch</span>
		<span><input type="checkbox" value="Dent">Dent</span>
		<span><input type="checkbox" value="Rust">Rust</span>
		<span><input type="checkbox" value="Respray">Respray</span>
		<span><input type="checkbox" value="Crack">Crack</span>
	</div>
	
</div>
            
          
!
via HTML Inspector

CSS

            
              $rad: 3px;
$blue: #31c1dc;
$lightblue: #04e1f2;


div#car-map {
  display: block;
	float: right;
	width: 65%;
	margin-right: 5px;
	background: white;
	@include box-sizing(border-box);
	padding: 10px;
	@include border-radius($rad);
	p { color: #acacad; }
	// Begin Map

	span#left-test, span#right-test {
		float: left;
		display: block;
		width: 100px;
		height: 100px;
		margin-left: 25px;
		background: $blue;
		cursor: pointer;
		&.completed {
			background: $lightblue;
		}
	}

	div.region-inputs {
		display: none;
		float: right;
		width: 20%;
		span {
			display: block;
			clear: left;
			input[type="checkbox"] {
				margin-right: 5px;
			}
		}
	}
	div.region-inputs.active {
		display: block;
	}

}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
                $(function() { // FIXED car map click regions
		$("#car-map > span").click(function() {
	        $(".region-inputs." + $(this).attr("id")).addClass("active").siblings().removeClass('active');
			$(this).addClass("completed");
		});
	});


//fixed above by re-ordering the $(this).addClass
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................