Q:

JS Cursor positioning with keyup

I have a function with onkeyup to modify the letters of text typed in uppercase. 
When I tried to edit a letter in the middle of the input text the cursor will automatically position at the end of text. 
I would like the cursor to keep the same position. 
https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_onkeyup

A:

$("#fname").on('input', function(){
     var start = this.selectionStart,
     end = this.selectionEnd;
     this.value = this.value.toUpperCase();
     this.setSelectionRange(start, end);
});

If you want to make only first latter to upperCase and all other to Lower case.  You can make it like.  
#fname {
    text-transform: lowercase;
}
#fname:first-letter {
   text-transform: uppercase;
}

But Please use only class for make some styles.