2版本的Jquery按钮切换 - 1不起作用

Question

所以我有两种创建切换按钮的方法，其名称会发生​​变化。第一个就像一个魅力。第二个仅在FIRST CLICK之后有效。知道为什么吗？

HTLM：

<div class="container">
    <div class="dropdown">
      <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Select Player
        <span class="caret"></span></button>
      <ul ng-repeat="name in Ids" class="dropdown-menu">
        <li>
          <a href="#/{{name.Player_Id}}">
              {{name.Player_First_Name}} {{name.Player_Last_Name}}
            </a>
        </li>
      </ul>
    </div>
  </div>

Jquery的：

<input id="showHideButton" type="button" value="inputRead More"></input>
<button id="showHideButton" type="text" value="Read More">buttonRead More</button>