Hi, so i have an input text <input type="text" name="numguest" id="number-of-guests"> and a button Okay. When a number say, 4 is entered into that text box and clicked okay, 4 of this text box <input type="text" name="guest-name[]" placeholder="Guest Name" id="text-gname"> will appear.

i tried:

$("#okay").on("click", function(){
      var num_of_guests = $("#number-of-guests").val();
      var input_text = $("#text-gname").clone();
      var target = $(".guests-tbody");
      for(var i = 0; i < num_of_guests; i++)
        var clone = input_text.clone();
        clone.attr('id','style', '');

but nothing seems to be happening except fot the alert and Hide function. TIA

Apart from the Hide() it's working here. You're making a clone of clone though, and var target = $(".guests-tbody"); is technically a list of elements, so it will append to all the elements with that class. Not sure if clone.attr('id','style', ''); is doing what you think it's doing; it sets id to "style". You could use clone.attr({"id":"","style":""}); instead if you want id and style attributes empty for the clone.