JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.aspnetcdn.com/ajax/knockout/knockout-3.0.0.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css">
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js"></script>
<div class="container-fluid">
<div class="row-fluid">
				<div class="span1"></div>
				<div class="span10"
					style="margin-bottom: 6px; margin-top: 0px; background: #efeee9">
				<img
						src="/MoDoc/resources/ui_resources/img/mo doc title.jpg"
						alt="" align="left">
					<h2 align="center" style="margin-top: 18px;"></h2>
				</div>
				<div class="span1"></div>
			</div>

	<input type="hidden" id="projectUrl" value="/MoDoc/">
<div class="row-fluid">
				<div class="span1"></div>
				<div class="span10"
					style="background: #eee; border: 1px solid #ddd;">
	<div id="doctor" class="tab-pane "
								style="margin-left: 28px; margin-right: 48px;">
								<div style="margin-bottom: 18px;" class="tabbable">
									<ul class="nav nav-pills" 
										id="doctorTabs">
										<li class="active"><a data-toggle="tab"
											href="#Profile"><i class="cus-user_add"></i> View Profile </a>
										</li>
										<li class=""><a data-toggle="tab" href="#appointments"><i
												class="icon-time"></i> View Appointments</a>
										</li>
									</ul>

									<div style="padding-bottom: 9px;overflow:hidden" class="tab-content">
										<div id="Profile" class="tab-pane active">
										 Profile
										 
										 		<div class="span6">
	<p>
		<label class="control-label" for="inputIcon">Name :</label>
		<input class="span8" type="text" data-bind="value: person.name"
		 data-required="true" data-trigger="change" name="name">
	</p>
	<p>
		<label class="control-label" for="inputIcon">Department :</label>
	<select class="span8" name="department" 
					data-bind="options: departmentOptions,value: person.department,optionsCaption: 'Select...

JavaScript

var DocSchedule=function(id,day,fromtime,totime,hospital,hospitalId)
{
this.id=ko.observable(id);
this.day=ko.observable(day);
this.fromtime=ko.observable(fromtime);
this.totime=ko.observable(totime);
this.hospital=ko.observable(hospital);
this.hospitalId=ko.observable(hospitalId);
}

var iter=0;


//var genderOptions = ['Male', 'Female'];
//var degreeOptions=['BDS','DA(Anaesthesia)','MBBS','MBBS,MD','MBBS,MD(Med)PMCH','MBBS,MD,FNB','MBBS,MS(ENT)','MD,DM,FISC','MD,MS,PhD,DSc','MDS(Oral Surgery)','MS(OPHTH),FICS','MS,DNB,MRCS(Edin),MCh(GASTRO)']
//var departmentOptions=['Anesthesiology','Bio-Chemistry','Cardiac Rehab Yoga','Cardio Thoracic Surgery','Cardiology','Chest Physician','Cosmetic Plastic and Hand Surgery','Critical Care','Dental&Facio maxillary Surgery','Dermatology','Diabetology','Dietary Services','Emergency Medicine','Endocrinology','Endoscopic,Head & Neck Surgery','Endoscopy','Gastroenterology','Gastrointestinal Medicine','General Medicine','General Surgery','Geriatrics','Gynecology','Hematology','Internal Medicine','Interventional Radiology','Laboratory Medicine','Laparoscopic Surgery','Medical Oncology','Micro-Biology','Nephrology','Neuro-Surgery','Neurology','Nuclear Medicine','Nuclear Medicinee','Obstetrics and Gynecology','Ophthalmology','Orthopedics & Traumatology','Otorhinolaryngology','Pathology','Pediatric Cardiology','Pediatric Surgery','Pediatrics','Physician','Physiotherapy','Psychiatry','Pulmonology','Radio-Diagnosis','Radiology','Rheumatology','Surgical Gastro-Enterology','Surgical Oncology','Urology','Vascular Surgery']
var Doctor = function(nameParam, usernameParam){
    this.name = nameParam;
    this.username = usernameParam;
};
var doctors = [];

var Patientp = function () {
    this.id = ko.observable('');
    this.name = ko.observable('');
    this.degree = ko.observable('');
    this.gender = ko.observable('');
	//this.consultant= ko.observableArray(consultantArrValue);
	this.username = ko.observable('');
	this.password =...