JSFiddle - React, Tailwind, and code Playground
HTML
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<form name="add_form" action="ebill.php" method="post">
<input type="text" name="balance" id="tot2" value="" />
<input type="submit" id="submit" name="submit" disabled="disabled" />
</form>
CSS
active {
background-color: blue;
color: white
}
JavaScript
$(document).ready(function() {
$("#tot2").on("keyup", function() {
var elem = $(this);
if (elem.val() >= 10) {
$("#submit").removeAttr("disabled").addClass("active");
} else {
$("#submit").attr("disabled", "disabled").removeClass("active");
}
})
});