forms - List element content by class with jquery -

i have several forms created dynamically using php. list fields mandatory above each form.

t should this:

<div class="mandatory_list">mandatory fields: first name, email</div>  <form> <label>first name*</label><input type="text" /> <label>last name</label><input type="text" /> <label>email*</label><input type="text" /> <label>comments</label><input type="text" /> </form> 

if simplify things can give mandatory labels seperate class. came far:

<script>     var mandatory= ( $("label:contains('*')").text() );     $('#mandatory_list').html("mandatory fields: " + mandatory); </script> 

this gives me following output: "mandatory fields: first name *email *". mean had replace asterisks comma's. there's better way go this.

i think easier class on mandatory fields, preference selector:

:first off, rid of text in list , add class:

<div class="mandatory_list">mandatory fields:</div>   <form>  <label class='mandatory'>first name*</label><input type="text" />  <label>last name</label><input type="text" />  <label class='mandatory'>email*</label><input type="text" />  <label>comments</label><input type="text" />  </form> 

now populate list, removing last comma specified:

var mylist = $('.mandatory_list').text(); $('.mandatory').each(function() {     mylist += ' ' + $(this).text().replace('*', ','); }); mylist = mylist.slice(0, mylist.length - 1); $('.mandatory_list').text(mylist); 

edit: adapted "multiple" forms

$('form').each(function() {     var myheader = $(this).prev('.mandatory_list');     var mylist = myheader.text();     $(this).find('.mandatory').each(function() {         mylist += ' ' + $(this).text().replace('*', ',');     });     mylist = mylist.slice(0, mylist.length - 1);     myheader.text(mylist); });