JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="initial-scale=1.0,width=device-width,height=device-height,user-scalable=no">
	<title>Tender</title>
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.css">
</head>
<body>


	<div class="box"></div>
<button onclick="console.log(document.querySelector('#bet_num').value)">
Вывести инпут в консоль
</button>
</body>
</html>

CSS

@import url('https://fonts.googleapis.com/css?family=Roboto&display=swap');

:root {
      
      --body-background: #444;
      --border: #000; /* rgb(128, 255, 0); */
      --description-background: #333;
      --description-color: #fff;
      --category-color: rgb(128, 255, 0);
      --button-border: #222;
	  --button-bg: rgb(128, 255, 0);
	  --button-color: #222;
	  --input-border: #333;
      --input: #fff;
	  --input-text: #222;

}

::-webkit-scrollbar { width: 6px; height: 3px; background: #222;}
::-webkit-scrollbar-button {  background-color: ; height: 6px; }
::-webkit-scrollbar-track {  background-color: #333;}
::-webkit-scrollbar-track-piece { background-color: #555;}
::-webkit-scrollbar-thumb { height: 50px; background-color: rgb(128, 255, 0);}
::-webkit-scrollbar-corner { background-color: #999;}}
::-webkit-resizer { background-color: #666;}

* {
      font-family: 'Roboto', sans-serif;
      outline: none;
}

body {
      height: 100%;
      width: 100%;
      display: flex;
      justify-content: center;
      flex-wrap: wrap;
      padding: 0;
      margin: 0;
      background: var(--body-background);
}

a {
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--view-button-color);
	text-decoration: none;
}

input,select {
      margin: 15px 0 0 0;
      width: 80%;
      height: 25px;
      padding: 5px;
      border: 0;
      border-radius: 5px;
      background: var(--input);
      color: var(--input-text);
      font-weight: bold;
      font-size: 13px;
      outline: none;
      border-top: 2px solid var(--input-border);
      border-bottom: 2px solid var(--input-border);
}

#inputs button {
      height: 40px;   
      background: var(--button-bg);
      color: var(--button-color);
      font-weight: bold;
      font-size: 14px;
      border: 2px solid var(--button-border); 
      margin: 20px 0 0 0; 
      box-shadow: 0 0 5px #222; 		
}

#inputs button:hover {
      opacity: 0.8;
     ...

JavaScript

$( document ).ready(function() {
	const select_id = [
  	[{
    	id: 55,
      category: " Живой вес	",
      description: "asdasdasdasdasdasdasd",
      company: "Ромашка",
      images: "default_tender.jpg",
      creator: 17,
      state: null,
      country: "Россия",
      mass1: "40000555555кг",
      mass2: "900руб./кг",
      mass3: "400000кг",
      mass4: "300руб",
      nds1: "УСН",
      nds2: ""
    },
    false,
    false],
    false,
    false
  ];
  
	let mass = +select_id[0][0].mass3.replace(/[^-0-9]/gim, ''),
		start_bet = +select_id[0][0].mass2.replace(/[^-0-9]/gim, ''),
		step = +select_id[0][0].mass4.replace(/[^-0-9]/gim, ''),
		current_mass = mass;

	const inputs = `<div id='inputs'>
						<input type='number' step='${step}' id='bet_num' onclick='if(this.value < ${start_bet}) $(this).val(${start_bet});' oninput='return $(this).val()' placeholder='Ставка минимум: ${start_bet}руб./кг'>
						<div class="mass"><div id="value">${mass}кг</div><div id="add">+</div><div id="remove">-</div></div>
						<div class="result_bet">${start_bet * current_mass} р.</div>
						<button id='submit'>Предложить</button>
					</div>`;

	let v1 = select_id[1],v2 = select_id[2];

	let form;

	const select_list = {bets: []};

	let nds1 = select_id[0][0].nds1;
	let nds2 = select_id[0][0].nds2;
	let nds;
	let country = select_id[0][0].country;
	let all_mass = select_id[0][0].mass1;

	if(nds2 !== '' && nds2 !== 0) nds = nds2;
	else nds = nds1;

	if(select_list.bets[1] !== '') {

		form = '';

		if(v1 === true || v2 === true) form = '';
		else form = inputs;

		const pay = `
					<div id='description'>${select_id[0][0].description}</div>
					<div class="pay">
						<div id='list'></div>
						${form}
					</div>
					`;
		const tender = `<div id='tender'>
							<div id='category'>Категория: ${select_id[0][0].category} / Ндс: ${nds} / Страна: ${country} / В наличии: ${all_mass}</div>
						</div>
						${pay}`;

		$('.box').append(tender);
    
  }

	else {

		form =...