JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrap">
		<select type="text" id="firstCity">
			<option value="">Москва</option>
			<option value="">Уфа</option>
			<option value="">Рязань</option>
			<option value="">Дубно</option>
			<option value="">Иваново</option>
			<option value="">Люберцы</option>
		</select>
	</div>
	<div class class="wrap">
		<select type="text" id="secondCity">
			<option value="">Москва</option>
			<option value="">Уфа</option>
			<option value="">Рязань</option>
			<option value="">Омск</option>
			<option value="">Дубно</option>
			<option value="">Иваново</option>
			<option value="">Люберцы</option>
		</select>
	</div>
	<div class="wrap">
		<input id="streetFrom" type="text" placeholder="Улица отправки">
		<input id="streetIn" type="text" placeholder="Улица получения">
	</div>
	<div class="wrap">
		<label><input type="radio" name="radio" value="usual">Стандартная</label>
		<label><input type="radio" name="radio" value="fast">Срочная</label>
	</div>
	<div class="wrap">
		<input type="text" id="weight" placeholder="Вес груза">
	</div>
	<div class="wrap">
		<button id="calc">Рассчитать</button>
	</div>
	<div class="wrap">
		<p class="pay">Стоимость: <span class="pay-pay"></span></p>
	</div>

JavaScript

let delivery,
	firstCity,
	secondCity,
	weight,
	pay,
	streetFrom,
	streetIn,
	secondMoscowOrNot,
	firstMoscowOrNot

const city = [
	{
		city: 'Уфа',
		weight: 1,
		usual: '960',
		fast: 'Уточните у оператора'
	},
	{
		city: 'Рязань',
		weight: 1,
		usual: '980',
		fast: 'Уточните у оператора'
	},
	{
		city: 'Омск',
		weight: 1,
		usual: '1000',
		fast: 'Уточните у оператора'
	}
]

const street = [
	{
		street: 'Пушкинская',
		weight: 1,
		usual: '960',
		fast: 'Уточните у оператора'
	}
]

const moscowCity = [
	{
		city: 'Дубно',
		weight: 1,
		usual: '1600',
		fast: '1630'
	},
	{
		city: 'Иваново',
		weight: 1,
		usual: '1800',
		fast: '1850'
	},
	{
		city: 'Люберцы',
		weight: 1,
		usual: '1300',
		fast: '1440'
	}
]

$('#calc').on('click', () => {
	delivery = $('input[name="radio"]:checked').val();
	firstCity = $("#firstCity option:selected").text();
	secondCity = $("#secondCity option:selected").text();
	weight = $("#weight").val();
	streetFrom = $("#streetFrom").val();
	streetIn = $("#streetIn").val();


	for (let el = 0; el < moscowCity.length; el++) {
		if (secondCity === moscowCity[el].city) {
			secondMoscowOrNot = "moscow-city"
		} else if (secondCity != moscowCity[el].city) {
			secondMoscowOrNot = "not-moscow-city"
		}
	}

	for (let le = 0; le < moscowCity.length; le++) {
		if (firstCity === moscowCity[le].city) {
			firstMoscowOrNot = "moscow-city"
		} else if (firstCity != moscowCity[le].city) {
			firstMoscowOrNot = "not-moscow-city"
		}
	}

	if ((secondCity === firstCity) && (secondCity != "Москва") && (firstMoscowOrNot === "not-moscow-city")) {
		for (let i = 0; i < city.length; i++) {
			if ((secondCity === city[i].city) && (parseInt(weight) === city[i].weight)) {
				if (delivery === 'fast') {
					pay = city[i].fast;
				} else if (delivery === 'usual') {
					pay = city[i].usual;
				}
			}
		}
	} else if ((secondCity === firstCity) && (secondCity != "Москва") && (firstMoscowOrNot === "moscow-city")) {
		for (let i = 0; i < moscowCity.length;...