SO - 21774600

by Alvin Olavarrieta

HTML

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/css/bootstrap.css">
<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/js/bootstrap.js"></script>
<div class="panel-heading">
    <h4 class="panel-title">
        <a data-toggle="collapse" data-parent="#accordion" href="#q1">
            Question 1
        </a>
    </h4>
</div>
<div id="q1" class="panel-collapse collapse">
    <div class="panel-body">
        <div class="form-group">
            <label for="inputQ1" class="col-sm-2 control-label">Question</label>
            <div class="col-sm-7">
                <input type="text" class="form-control" id="inputQ1" placeholder="e.g How was our service?"/>
                <input type="text" class="form-control" id="inputQ1" placeholder="e.g How was our service?"/>
            </div>
        </div>
    </div>
</div>

JavaScript

jQuery(function ($) {
    $('.panel-body input').keyup(function(){
        $(this).closest('.panel-collapse').prev('.panel-heading').find('a').text(this.value)
    })
});