JSFiddle - React, Tailwind, and code Playground

by Ray Mak

HTML

<div class="accounts">
1<input name="1" value="" /><br>
2<input name="2" value="" /><br>
3<input name="3" value="" /><br>
4<input name="4" value="" /><br>
5<input name="5" value="" /><br>
6<input name="6" value="" /><br>
7<input name="7" value="" /><br>
8<input name="8" value="" /><br>
9<input name="9" value="" /><br>
10<input name="10" value="" /><br>
11<input name="11" value="" /><br>
</div>

JavaScript

var vendor = [];
vendor = [{"vendor_id":"1","vendorname":"Coke","account_no":"34534554"},{"vendor_id":"2","vendorname":"Pepsi","account_no":"34634532"},{"vendor_id":"3","vendorname":"Dr. Pepper \/ 7 Up","account_no":"56754568"},{"vendor_id":"4","vendorname":"Frito Lay","account_no":"676554544"},{"vendor_id":"5","vendorname":"Blue Bunny","account_no":"678476543"},{"vendor_id":"6","vendorname":"Yummy","account_no":"9987654"},{"vendor_id":"7","vendorname":"Ork Farm","account_no":"23456767"},{"vendor_id":"8","vendorname":"Borden","account_no":"89765432"},{"vendor_id":"9","vendorname":"Highland","account_no":"2345678987"},{"vendor_id":"10","vendorname":"Nesquek","account_no":"798654324"}];

var getVendors = [];
$('.accounts input').each(function(){ 
    getVendors.push($(this).attr('name'));
});

<!-- $.each(getVendors, function(index, val) {
    vendor.filter(function(v) {
        if (v.vendor_id == val) {
            $('.accounts input[name=' + v.vendor_id +']').attr('value',v.account_no);
        } 
        else {
            $('.accounts input[name=' + val +']').attr('value','N/A');
        }
    })
}); -->