Trying to use the navbar and scrollTop () boot mark

Question

I am trying to create a one page website using bootstrap and jQuery. I made it so that every time you click on one of it <li>'s, it loads the content, centers the page vertically using the scrollTop () function. But this does not work with the navbar brand. I tried everything and a half.

Semi-relevant HTML

 <div class ="scrollUp">
 <!-- if buttonn active -->
  <nav class="navbar navbar-inverse navbar-fixed-top topNavBar">
 <div class="container-fluid">
  <!-- Brand and toggle get grouped for better mobile display -->
  <div class="navbar-header">
    <button type="button" class="navbar-toggle collapsed">
    <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="#">Brand</a>
  </div>
  <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
    <ul class="nav navbar-nav">
      <li id="myStory"><a href="#">My Story</a></li>
      <li id="webCoding"><a href="#">Web Coding</a></li>
      <li id="personalTraining"><a href="#">Personal Training</a></li>
      <li id="music"><a href="#">Music</a></li>
    </ul>

JQuery

$(".navbar-brand").on("click", function(e) {
e.preventDefault();
 eliezerButton();
$(".scrollUp").scrollTop();

Answer 1

This is tricky with the code you provided. But you use topNavBar as a class in your navbar class is not a bootstrap class. Not sure if this is the class you created, but this may be part of your problem.