I wrote below code using while loop printed like below

```
<p>

<input id="txtBox<?php echo $a; ?>" type="text" value="1" style="display:none;" />

<span id="txtBoxValue<?php echo $a; ?>">1</span>

</p>

```

when I click or select on the span I need convert it to the text field and after when deselect it will return to span text again 

for this task, I wrote multiple jquery functions but I need it to be a single function is it possible?

thankyou in advance

```
<script> 
    $(function() {

    $('#txtBoxValue1').on('click', function() {
        $(this).hide(); 
        $('#txtBox1').show(); 
    });

    $('#txtBox1').on('blur', function() {
        var that = $(this);
        $('#txtBoxValue1').text(that.val()).show(); 
        that.hide(); 
    });

    $('#txtBoxValue2').on('click', function() {
        $(this).hide(); 
        $('#txtBox2').show(); 
    });

    $('#txtBox2').on('blur', function() {
        var that = $(this);
        $('#txtBoxValue2').text(that.val()).show(); 
        that.hide(); 
    });
});
</script>

```