<script>
 $(document).ready(function(){
      var i=1;
      $('#add').click(function(){
           i++;
           $('#dynamic_field').append('<tr id="row'+i+'"><td><? echo $teamdrophome; ?></td><td><? echo $teamdropaway; ?></td><td><input type="text" name="postponed[]" placeholder="Type true if game is postponed" class="form-control name_list" /></td><td><input type="datetime-local" name="datetime[]" class="form-control name_list" ></td><td><input type="text" name="location[]" placeholder="Location" class="form-control name_list" /></td><td><button type="button" name="remove" id="'+i+'" class="btn btn-danger btn_remove">X</button></td></tr>');
      });
     $(document).on('click', '.btn_remove', function(){
           var button_id = $(this).attr("id");
           $('#row'+button_id+'').remove();
      });
});
</script>
<script>
function formatTeams (data) {
    if(!data.id) { return data.text; }
    var baseUrl = "/images/badges";
    imageString = data.element.text.toLowerCase();
    newImageString = imageString.replace(/ /g, "_");
    var $result = $(
    '<span style="min-width:150px;"><img src="' + baseUrl + '/' + newImageString + '.png" class="fwsbadge" style="width:30px!important;float:left;"/><br> ' + data.text + '</span>'
    );
    return $result;
};

$("#home").select2( {
    placeholder: "Search Teams",
    allowClear: true,
    templateResult: formatTeams
});

$("#away").select2( {
    placeholder: "Search Teams",
    allowClear: true,
    templateResult: formatTeams
});
</script>