JSFiddle - React, Tailwind, and code Playground

HTML

<div id="form">
    <div class="row">
        <h2 class="h2_city">Город</h2>
        <div class="cell">
            <select id="region" >
                <option value="-1" selected="selected">--Не выбранно--</option>
                <option value="1" >Область 1</option>
                <option value="2" >Область 2</option>
                <option value="3" >Область 3</option>
                <option value="4" >Область 4</option>
            </select>
            <select id="city"> 
                <option value="-1">--Не выбранно--</option>
                <!--Сюда мы грузим города-->
            </select>
        </div>
    </div>
    <div class="row deliver">
        <label class="active"><input type="radio" name="deliver" value="1"  checked="checked"/>Доставка курьером</label>
        <label><input type="radio" name="deliver" value="2" />Доставка пешком</label>
        <label><input type="radio" name="deliver" value="3" />Перебьетесь =)</label>
    </div>
    <div class="row">
        <button id="submit">Отправить</button>
    </div>
</div>
<div class="template_el">
<select id="city-1-template">
    <option value="1">Город 1</option>
    <option value="2">Город 2</option>
    <option value="3">Город 3</option>
    <option value="4">Город 4</option>    
</select>
<select id="city-2-template">
    <option value="5">Город 5</option>
    <option value="6">Город 6</option>
    <option value="7">Город 7</option>
    <option value="8">Город 8</option>    
</select>
<select id="city-3-template">
    <option value="9" >Город 9</option>
    <option value="10">Город 10</option>
    <option value="11">Город 11</option>
    <option value="12">Город 12</option>    
</select>
<select id="city-4-template">
    <option value="13" >Город 13</option>
    <option value="14">Город 14</option>
    <option value="15">Город 15</option>
    <option value="16">Город 16</option>    
</select>
</div>

<script>
    $("#region").change(function(){
      var template_namb =...

CSS

.template_el{
    display: none;
}
#region{
    min-width: 200px;
}
#city{
    min-width: 150px;
}

.error{
    
    border: 1px solid red;
}
.deliver label{
    display: block;
}
.deliver label.active{
    font-weight: bold;
}

JavaScript

$("#submit").click(function(){
  var save = true;
    $(".error").removeClass("error");
    $("#region,#city").each(function(){
         //проверка для селектов
      if ($(this).attr("value") == -1 ){
          $(this).addClass("error");
         save = false;
      }
    });
   
    
    if(save == true){
      //Если валидность есть то... 
       alert(
           "Область : " + $("#region").attr("value") + "\n\r" +
           "Город   : " + $("#city  ").attr("value") + "\n\r" +
           "Доставка: " + $(".deliver  :radio:checked").attr("value") + "\n\r" 
       );
     //ну и отправляем форму, либо отправляем содержимое полей аяксом        
        
    }else{
      alert("Не заполненны важные поля");
    }
    return false;
})