JQuery function keyup does not work on my project and other functions work

Question

i do not know why this code does not work if i key up any character the value of input show

 <div>
   <input class="form-control live" name="name" placeholder="Item Name" 
            data-class="live-title" required/>
 </div>

 $('.live').keyup(function () {
    $($(this).data('class')).text($(this).val());
 });

 <div class="card cats">
   <span class='price-tag'>$<span class="live-price">0</span></span>
   <img class='' src='' alt=''/>
   <div class='card-body'>
       <h5 class='live-title'>title</h5>
       <p class='live-desc'>Description</p>
       <p class='live-country'>Country</p>
   </div>
 </div>     

Answer 1

$(this).data('class') will be live-title .So in order to select a dom which have this class you need to prefix it with class selector using dot ( . )

 $('.live').keyup(function() { $("." + $(this).data('class')).text($(this).val()); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div> <input class="form-control live" name="name" placeholder="Item Name" data-class="live-title" required/> </div> <div class="card cats"> <span class='price-tag'>$<span class="live-price">0</span></span> <img class='' src='' alt='' /> <div class='card-body'> <h5 class='live-title'>title</h5> <p class='live-desc'>Description</p> <p class='live-country'>Country</p> </div> </div>