jQuery addClass example

Change class name on click in jQuery

by DefuZe

HTML

<div class="left">
	<form id="meters"><table class="abon-tab vod"><tbody>
      		<tr><th rowspan="2">№</th><th colspan="2">Показания водомеров</th><th rowspan="2">Расход</th></tr>
      		<tr><th>Предыдущие</th><th>Настоящие</th></tr><tr><td rowspan="2">1</td>
          <td class="cold">0.00</td><td class="cold">
          <input type="text" data-old="''" data-vodomer-id="651195164" name="cold1" class="inp" placeholder="________"></td>
          <td class="cold expense"></td></tr><tr><td class="hot emp">не установлен</td><td class="hot"></td><td class="hot"></td></tr></tbody></table><br><button class="btn" type="submit" data-acc="0" title="Передать показания">Отправить</button></form>
	<div class="msg ms-mt err"></div>
</div>

JavaScript

$('#meters input').on('change', function() {
			check($(this));
		});
    
    $('#meters input').each(function() {
				check($(this));
			});

function check(input) {
			exp = input.parent().siblings('.expense');
			exp.removeClass('err');
			val = Math.abs(parseInt(input.val(), 10)) || 0;
			input.val(val);
			input.removeClass('error');
      var oldInp = Math.abs(parseInt(input.data('old'), 10)) || 0; 
			res = val - oldInp;
			$('.ms-mt').hide();
			exp.text(res);
			if (res < 0 || res > 50) {
				exp.addClass('err');
				input.addClass('error');
			}
		}
    
  $('#meters').on('submit', function(e) {
			e.preventDefault();
				$('#meters input').each(function() {
					check($(this));
				});
        if (!$('.error').length) { 
        	alert ('suc');
        } else alert ('fail');
        
			})