Low_Weaper,
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<!--<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>-->
<script src="jquery.js"></script>
<title></title>
<style>
.product {
color: red;
}
</style>
</head>
<body>
<table>
<tr>
<td>
<span id="down">-</span>
<input type="text" value="0" label="name" id="counter">
<span id="up">+</span>
</td>
</tr>
</table>
<script>
// о при 0 черным, а при >0 красным
$('tr').on('click','#down, #up', function (event) {
var input = this.parentNode.getElementsByTagName('input')[0];
if(this.id == 'down'){
input.value-=1 ;
};
if(this.id == 'up'){
input.value = +input.value + 1 ;
};
input.value > 0?$(this).closest('tr').addClass('product'):$(this).closest('tr').removeClass('product');
})
</script>
</body>
</html>