JSFiddle - React, Tailwind, and code Playground

HTML

<div class="lines">
			<div class="tab1_unvisible"><input class="ch" type="checkbox"></div>
			<div class="tab2">Tesla Model S (2015)</div>
			<div class="tab3">11</div>
			<div class="tab4">$120 000</div>
		</div>
    <div class="lines">
			<div class="tab1_unvisible"><input class="ch" type="checkbox"></div>
			<div class="tab2">Tesla Model S (2015)</div>
			<div class="tab3">11</div>
			<div class="tab4">$120 000</div>
		</div>
    <div class="lines">
			<div class="tab1_unvisible"><input class="ch" type="checkbox"></div>
			<div class="tab2">Tesla Model S (2015)</div>
			<div class="tab3">11</div>
			<div class="tab4">$120 000</div>
		</div>

CSS

.lines{
	width: 100%;
	padding: 10px 0 10px 0;
	background-color: #FFFFFF;
	overflow: hidden;
	font-weight: 500;
	font-size: 17px;
}

.lines:hover{
	background-color: #F5F5F5;
	cursor: pointer;
}

.tab1_unvisible{
	float: left;
	width: 10%;
	padding: 8px 0 8px 0;
	text-align: center;
}

.tab2{
	float: left;
	width: 64%;
	padding: 8px 2% 8px 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.tab3{
	float: left;
	width: 9%;
	padding: 8px 0 8px 0;
}

.tab4{
	float: left;
	width: 15%;
	padding: 8px 0 8px 0;
}

JavaScript

$(".lines").click(function(){
var x = $(this).children().children("input");
    if(x.is(":checked")){
    $(x).trigger("change").prop("checked", false);
  }else{
    $(x).trigger("change").prop("checked", true);
  }     
});