javascript - Find children of a certain type -

i have array of forms in page. want iterate through forms, , find buttons in them. how can achieve in javascript alone, without libraries?

here's js code :

var forms = document.queryselectorall('form');  for(var = 0; < forms.length; i++;){     var form = forms[i];     form.addeventlistener('submit', validateform); }  function validateform(e){     e.preventdefault();         var button = ?; // want button child of form } 

i know can use buttons children of form :

var buttons = document.queryselectorall('form button'); 

but how can 1 button children of this form?

i've seen question asked multiple times, find children of parent known, specific id or that. have no idea how many forms there in page, , have no control on wether or not have unique id or else used differentiate them when using queryselectorall().

is possible achieve want?

i'm looking pure js alternative in jquery :

var $form = $('form'); var $childbutton = $form.find('button'); 

element has equivalent versions of queryselector/all , can called elements document. if looking button inside form element can call queryselector form element

var form = document.queryselector("#someform"); //will find first button in form var somebtn = form.queryselector("button"); //will find buttons in form. var somebtns = form.queryselectorall("button"); 

demo

let forms = document.queryselectorall("form");  [].foreach.call(forms,form=>{     form.queryselector("button").innertext += " - modified";  });

<form>    <button>a button</button><br>    <input><input>  </form>  <form><br><br>    <button>b button</button><br>    <input><input><br>    <button>c button</button>  </form><br><br>  <form>    <button>d button</button><br>    <input><input>  </form>