how to real time display input value to display to input name same with div id? or any other way?

Question

i need to real-time display input value with jquery. how to change div text as same with input name or or other way?

$('.inputs').keyup(function(){
  var namer = $('.inputs').attr('name');
  $('#' + namer).text($(this).val());
});

I expect XX named input value to display in XX id with div.

Answer 1

If you just want to update the div text from the input (single way), do something like this:

<input type="text" id="inputText">
<div id="dynamicText">Original Text</div>
<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
<script type="text/javascript">
    $('#inputText').keyup(function() {
        var text = $(this).val();
        $('#dynamicText').text(text);
    });
</script>

And if you want to show the div text as input's original value:

<input type="text" id="inputText">
<div id="dynamicText">Original Text</div>
<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
<script type="text/javascript">
    var OriginalText = $('#dynamicText').text();
    $('#inputText').val(OriginalText);
    $('#inputText').keyup(function() {
        var text = $(this).val();
        $('#dynamicText').text(text);
    });
</script>