Textbox should allow only decimals

I have created a dynamic html table with some input controls and here I want to enter only decimal values with two digits after dot(.)

ex: 1111.22 , 44445454.33

Html code:

<div id="divdynamic"></div>

And I append dynamic data to this id divdynamic

jQuery code:

$(document).ready(function () {
decimaldata();
});

function decimaldata()
{
var data = `<div class="closedata"><input type="text" class="fields" name="txtdecimal" autocomplete="off" onkeyup="decimalonly('txt1',this)" value=""></div>
<div class="closedata"><input type="text" class="fields" name="txtdecimal1" autocomplete="off" onkeyup="decimalonly('txt2',this)" value=""></div>`

$("#divdynamic").append(data);

}

function decimalonly(n,t)
{
if(n == "txt1")
{

if (((event.which != 46 || (event.which == 46 && $(this).val() == '')) ||
            $(this).val().indexOf('.') != -1) && (event.which != 45 || $(this).val().indexOf('-') != -1) &&
            (event.which < 48 || event.which > 57)) {
            event.preventDefault();

            //alert('hit');
          }

 // here my logic 
}
else
{
if (((event.which != 46 || (event.which == 46 && $(this).val() == '')) ||
            $(this).val().indexOf('.') != -1) && (event.which != 45 || $(this).val().indexOf('-') != -1) &&
            (event.which < 48 || event.which > 57)) {
            event.preventDefault();

            //alert('hit');  
        }

    // here my logic 


}


}

In the above method decimalonly(n,t) I'm checking the entered key but that code is not working fine but if I entered any (non digit value) the alert('hit'); message is hitting but the entered non digit value is showing on the UI, it should not happen should only take decimals.

please suggest me how to achieve this.

Sorry for my bad English.

I have removed the "decimalonly" function and added an event listener to all inputs with the .fields class.

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

document.addEventListener('DOMContentLoaded', function() {
  decimaldata();
});

function decimaldata() {
  var data = `<div class="closedata">First Number <input type="text" class="fields" name="txtdecimal" autocomplete="off" oninput="decimalonly(event, 'txt1', this)" value=""></div>
  <div class="closedata"> Second Number <input type="text" class="fields" name="txtdecimal1" autocomplete="off" oninput="decimalonly(event, 'txt2', this)" value=""></div>`;

  document.querySelector('#divdynamic').innerHTML = data;
}

function decimalonly(event, n, t) {
  if (n === 'txt1' || n === 'txt2') {
    var value = t.value;

    // only allow numbers and one dot
    value = value.replace(/[^0-9.]/g, '');
    var dotCount = (value.match(/\./g) || []).length;

    if (dotCount > 1) {
      // remove any extra dots
      value = value.replace(/\./g, function(match, offset) {
        return offset ? '' : '.';
      });
    }

    // limit to two decimal places
    var decimalIndex = value.indexOf('.');
    if (decimalIndex !== -1 && value.length - decimalIndex > 3) {
      value = value.substring(0, decimalIndex + 3);
    }

    // update the input value
    t.value = value;
  }
}

<!-- language: lang-css -->

input[type=text] {
  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  box-sizing: border-box;
  border: 3px solid #ccc;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  outline: none;
}

input[type=text]:focus {
  border: 3px solid #555;
}

<!-- language: lang-html -->

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="divdynamic"></div>

<!-- end snippet -->

When the user types in one of these inputs, the code removes any characters that are not digits or a period and then ensures that there is only one period in the input and that there are no more than two digits after the period.