JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.1.319/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.1.319/styles/kendo.bootstrap.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.1.319/styles/kendo.mobile.all.min.css">
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.1.0.js"></script>
<script src="http://cdn.kendostatic.com/2013.1.319/js/kendo.all.min.js"></script>
<body>

	<div id="newview" data-role="view" data-title="New Contact" data-layout="viewlayout" data-model="newViewModel">
		<form action="" method="post">
			<ul id="newformlist" data-role="listview">
				<li>
					<label>Name:</label>
					<input type="text" id="Name" data-bind="value:newName" />
				</li>
				<li>
					<label>Suffix:</label>
					<input type="text" id="Suffix" name="Suffix" data-bind="value:newSuffix" />
				</li>
				<li>
					<label>Email:</label>
					<input type="email" id="Email" name="Email" data-bind="value:newEmail" />
				</li>
				<li>
					<label>Phone:</label>
					<input type="tel" id="Phone" name="Phone" data-bind="value:newPhone" />
				</li>
			</ul>
		</form>
	</div>

	<div id="existingview" data-role="view" data-title="Existing Contacts" data-layout="viewlayout" data-model="existingViewModel">
		<ul id="existinglist" data-role="listview" data-bind="source:contacts" data-template="contacttemplate">
		</ul>
	</div>

	<script type="text/x-kendo-template" id="contacttemplate">
		<h3>
			#= Name#
			# if (Suffix != null && Suffix.length > 0) { #
				#= Suffix #
			# } #
		</h3>
		<div>
			#= Phone #
		</div>
		<div>
			#= Email #
		</div>
	</script>
	
	<div data-role="layout" data-id="viewlayout">
		<header data-role="header">
			<div data-role="navbar">
				<a class="nav-button" data-align="left" data-role="backbutton">Back</a>
				<span data-role="view-title"></span>
			</div>
		</header>

		<footer...

JavaScript

var kendoApp = new kendo.mobile.Application(document.body, {
	loading: "Loading..."
});


var newViewModel = kendo.observable({
	newName: "ABC",
	
	newSuffix: "",
	
	newPhone: "",
	
	newEmail: ""
});

var existingViewModel = kendo.observable({
	contactsLoaded: false,
	
	contacts: [
		{ Name: "Ted Person", Suffix: "", Email: "ted.person@fake.com", Phone: "555-555-5555" },
		{ Name: "Amu Person", Suffix: null, Email: "amy.person@fake.com", Phone: "555-555-5555" },
		{ Name: "Bob Person", Suffix: "Jr", Email: "bob.person@fake.com", Phone: "555-555-5555" }
	]
});