JSFiddle - React, Tailwind, and code Playground

HTML

<select id="id_myselect" name="myselect">
   <option value="0">---------</option>
   <option value="1">1</option>
   <option value="7">2</option>
   <option value="10">3</option>
</select>

<select id="id_book" name="book">
   <option value="0">---------</option>
   <option value="1">Book1</option>
</select>

<input id="id_number" name="number" type="number" />
<div id="add_button">Add</div>

CSS

.error{
    border:1px solid red;
}

JavaScript

$(function(){
    $('#add_button').on('click',function(){
        
        if($( "#id_myselect" ).val() == 0){// remove option:selected
           $("#id_myselect").addClass( "error" );
        }else if($( "#id_book" ).val() == 0){// remove option:selected
           $("#id_book").addClass( "error" );
        }    
        else if($( "#id_number" ).val() <= 0){
           $("#id_number").addClass( "error" );
        }
    });
    $("#id_myselect,#id_book,#id_number").on('change',function(){
       if(this.value) $(this).removeClass('error');
    });
});