how to save data into a specific div when clicked?

Question

New to this, how to save data into a specific div when clicked?

<form id="form">
 <div id="add">
  <input type="number" class="pts">
   <textarea class="rmks"></textarea>
 </div>
<div id="sub">
 <input type="number" class="pts">
   <textarea class="rmks"></textarea>
</div>
<button type="button" class="save">SAVE</button>
</form>

I don't know what's the correct way to do this. cant save data in database under <div id="sub">

<script>
$('.save').on('click',function(){
 var pts = $('.pts').val();
 var rmks = $('.rmks').val();
  $.ajax({
   url:"insert.php",
   method:"POST",
   data:{pts:pts,rmks:rmks},
   success:function(){
     swal({
      title:"Success!",
      timer:3000,
      icon:"success",
     })
    }
   })
  })
</script>

Answer 1

Maybe you could read form data instead of getting inner html value. Read here:

How can I get form data with JavaScript/jQuery?

Also, can you paste insert.php code ? It will be easier to help you as well