JSFiddle - React, Tailwind, and code Playground

HTML

<div id="child">
    <input type="textbox" name="quantity" id="qty" placeholder="Enter a number"/>
    <a href="#" id="expand">Expand</a>
</div>

CSS

#parent
{
    border:1px blue solid;
    height:500px;
    width:500px;
    padding:10px 10px 10px 10px;
}

#child
{
    border:1px red solid;
    width:100%; 
}
#qty
{

}

JavaScript

$(document).ready(function()
{
 $('#expand').click(function()
    {
        var qty= $('#qty').val();
        
        for (var counter = 0; counter < qty; counter++)
        {
            $('#child').html($('#child').html() + '<br/>new text');            
        }
    });
});