Correct number is not being displayed in the textbox
<p>Problem:</p>

<p>In the "Number of Answers" textbox, it should display the number 1, but it doesn't, it displays the number 2 and the reason it is displaying this number is that before the buttons changed, you selected 2 letter buttons, so it displays 2 in the textbox because you previously chose 2 letter buttons.</p>

<p>Now this is happening because of this code:  </p>

<pre><code>$('.answertxt', context).val(context.find('.answerBtnsOn').length &gt; 0 ? context.find('.answerBtnsOn').length : '');,
</code></pre>

<p>in the <code>$('.gridBtns').on('click', function()</code> but I do need this code. </p>

<p>The reason I need this code is because lets say there is 7 letter buttons "A-G" and you turn on all the letter buttons, the textbox would display number "7", but if I change my mind and I want to only display 5 letter buttons "A-E", then the textbox would change from "7" to "5" as now only 5 buttons are turned on. That is why I need this code.</p>

<p>So my question is that if the user has clicked on the "Add" button, how can I get the number from the "Number of Answers" column within the row added be displayed in the textbox?</p>

<p>Below is the code I have where it is suppose to display the number within the textbox when the "Add" button is clicked on but it is over written because of the <code>"$('#btn'+gridValues).trigger('click');"</code> and in that code is the </p>

<pre><code>$('.answertxt', context).val(context.find('.answerBtnsOn').length &gt; 0 ? context.find('.answerBtnsOn').length : '');,
</code></pre>

<p>in the <code>$('.gridBtns').on('click', function()</code></p>

<pre><code>function addwindow(numberAnswer, gridValues, btn) { 

        $('#mainNumberAnswerTxt').val(numberAnswer);
        $('#btn'+gridValues).trigger('click');

}
</code></pre>
