JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<content>
<div id="box1" class="v1 clicable">A : <span class="num">0</span></div>
<div id="box2" class="v2 clicable">B: <span class="num">0</span></div>
<div id="box3" class="v3 clicable">C: <span class="num">0</span></div>
</content>
</body>
CSS
content {
display: -moz-box;
display: -webkit-box;
display: box;
box-orient: horizontal;
width: 100%;
height : 100%;
}
div {
-moz-box-flex: 1;
-webkit-box-flex: 1;
box-flex: 1;
height: 100px;
}
.v1{
background : #FCC;
}
.v2{
background : #CFC;
}
.v3{
background : #CCF;
}
JavaScript
$(".clicable").click(function() {
$(this).children("span").html(parseInt($(this).children("span").html()) + 1);
});