tooltip for input fields not loading

Question

I have many input fields and I am trying to show the tooltip for those input fields. The inputs fields are showing in a modal window and the jQuery UI tooltip is loaded on page load, so I am trying to use the following functuion to loop over all the input fields and show the tooltip on hovering on the respective input field. It should pick the value of input field to show that details.

What am I missing here?

Any idea? Below is my code:

On my AJAX success callback, I am using the function loadnecessaryDetails(), which is implemented like this:

function loadnecessaryDetails() {
  var inputs = document.getElementsByTagName('input');
  for(var i = 0; i < inputs.length; i++) {
    inputs[i].style.border = 'none';
    inputs[i].style.backgroundColor = 'transparent';
    inputs[i].style.color = '#000';
    var inputClasses = inputs[i].className.split(' ');
    var tooltipClass = inputClasses.join('.');
    $('.tooltipClass').tooltip({
      classes: {
        "ui-tooltip": tooltipClass
      }
    });
  }
}

But it is doing nothing, nothing is shown when I hover over the input fields.