When the "+header" button is clicked, I am looking to automatically position the insertion point inside the text area. Currently, after pressing the button, the text box displays information like address, date, time etc. but the cursor does not start inside the text box.
The goal is to have the insertion point placed on the third line upon button press so that users can immediately begin typing without the need to manually click inside the text area. The styling is done using Tailwind CSS.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Tailwind</title>
</head>
<body class="bg-gray-100">
<div class="container font-sans bg-white mx-auto px-4 py-4 rounded shadow-md">
<form action="" method="" class="form grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4">
<div class="text-lg w-full underline font-bold col-span-1 sm:col-span-2 md:col-span-3 lg:col-span-4">
<h1>Notification Information</h1>
</div>
<div class="Date Received space-y-4">
...
const monthNames = [
"January",
"February",
"March",
"April",
"May",
"June",
"July",
"August",
"September",
"October",
"November",
"December"
];
var today = new Date();
var civilianToday = new Date();
var time = today.getHours() + ":" + today.getMinutes();
...
function setPosition() {
var txtarea = document.getElementById("script");
...