JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<body>

    <nav class="navbar navbar-fixed-bottom navbar-inverse" role="navigation">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="index.html">Create Theme</a>
        </div>

        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse navbar-ex1-collapse">
          <ul class="nav navbar-nav">
            <li data-index="about"><a href="#about">About</a></li>
            <li data-index="services"><a href="#services">Services</a></li>
            <li data-index="contact"><a href="#contact">Contact</a></li>
          </ul>
        </div><!-- /.navbar-collapse -->
      </div><!-- /.container -->
    </nav>

<section class="content" data-index="about">
    <div class="container">
        <div class="row">
            <div class="col-md-12 col-sm-12 col-xs-12 text-center">
                <h1 class="introtext">About Page here</h1>
                <span class="btn buttonborder">
                    Text placeholder
                </span> 
            </div>
        </div><!-- row -->
    </div>
</section>



<section class="content" data-index="services">
    <div class="container">
        <div class="row">
            <div class="col-md-12 text-center">
                <h1>Services</h1>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin laoreet scelerisque leo, sit amet adipiscing odio. Praesent leo nisi,...

CSS

body {
        margin-top: 50px;
        margin-bottom: 50px;
        background: none;
}

section {
    width: 100%;
    height: 100%;
    position:absolute;
    top: 0;
    left: 0;
}

.content {
    display:none;
}
}

JavaScript

$('.nav li').click(function(){
    var index = $(this).attr('data-index');
    $('.content').hide();
    $('section[data-index="'+index+'"]').show();
});