JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<div id="time">
<input type="text" name="from" placeholder="12:00 AM" />
<input type="text" name="to" placeholder="12:30 AM" />
<input type="text" name="from" placeholder="13:00 AM" />
<input type="text" name="to" placeholder="13:30 AM" />
</div>
<span id="output"></span>
<button id="btn">Click</button>
JavaScript
$("#btn").click(doStuff);
function doStuff() {
var dataArray = []
var newArrayLength;
$("#time").find('input').each(function() {
if (this.name === "from") {
var data = {};
data[this.name] = this.value
newArrayLength = dataArray.push(data);
} else if (this.name === "to") {
dataArray[newArrayLength - 1][this.name] = this.value;
}
});
console.log(dataArray);
}