jquery - How to insert text inside of arrow icon -

i created left , right arrow icons yes , no text displaying beside of arrow icons.now task text inserted in in-line arrow icons.

<div class="modal fade" id="modal" role="dialog" aria-labelledby="loginmodallabel" aria-hidden="true"> <div class="modal-dialog">     <div class="modal-content login-modal">         <div class="modal-header login-modal-header">             <button type="button" class="close" data-dismiss="modal" aria-label="close"><span aria-hidden="true">&times;</span></button>              <h4 class="modal-title text-center" id="modallabel">confirm</h4>         </div>         <div class="modal-body">             <div class="text-center">                 <div role="tabpanel" class="login-tab">                     <div class="tab-content">                         &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;                         <br />                         <label for="no">no</label>                         <i class=" pull-right glyphicon glyphicon-arrow-left"></i>                         <label for="yes">yes</label>                         <i class="pull-right glyphicon glyphicon-arrow-right"></i>                     </div>                 </div>             </div>         </div>     </div> </div> 

you have place arrows inside container position relative. set arrows position absolute. , place them want. work...

<label for="no" style="position:relative;">    <i class="pull-right glyphicon glyphicon-arrow-left" style="position:absolute; top:0; left:0;"></i> no</label>