JSFiddle - React, Tailwind, and code Playground

HTML

<div id="bill1" class="bill hide withPadding">
    <h3>Bill 1</h3>
    <span>
        <label>Bill no</label>
        <input type="text" name="billNo" class="textField" value="123" />
    </span>
    <span>
        <label>Bill total</label>
        <input type="text" name="billTotal" class="textField"/>
    </span>
    <span>
        <input type="button" name="addBillDetails" value="Add bill items"/>
    </span>
</div>  

<div id="bill2" class="bill hide withPadding">
    <h3>Bill 2</h3>
    <span>
        <label>Bill no</label>
        <input type="text" name="billNo" class="textField" value="456" />
    </span>
    <span>
        <label>Bill total</label>
        <input type="text" name="billTotal" class="textField"/>
    </span>
    <span>
        <input type="button" name="addBillDetails" value="Add bill items"/>
    </span>
</div>

JavaScript

$("input[name=addBillDetails]").live('click', function() {
    alert($('input[name=billNo]', $(this).closest("div.bill")).val());
});