Create multiple simultaneous functionality for a single button

Question

Hi, I'm trying to create a save button that saves multiple input text boxes at the same time. I have figured out how to save one text box, but not multiple.(I do use Jquery)
Here is the html code:
<td>first name: <span id="iFN">___</span><input type="text" id="FN"></td>
<td>last name: <span id="iLN">___</span><input type="text" id="LN"></td>
<input type="submit" id="save">
My Javascript code so far:
$(function(){
chrome.storage.sync.get('iFN',(function(sa){
$('#iFN').text(sa.iFN);
}))
$('#Save').click(function(){
chrome.storage.sync.get('iFN',(function(sa){
var firstname = "";
if (sa.iFN){
firstname = sa.iFN;
}
var firstname2 = $('#FN').val();
if(firstname2){
firstname = firstname2;
}
chrome.storage.sync.set({'iFN': firstname});
$('#iFN').text(firstname);
$('#FN').val('');
}))
})
})
I've tried multiple ideas to have it save last name too, but without creating multiple buttons for every single input text box, Idk how to get it to save multiple things.

Answer 1

You will have to create a function that loops through all different text fields, you managed to do it for one nox just do the same for the others and combine.