jQuery to dynamically add table rows

jQuery to dynamically add table rows

I want to dynamically add table rows on change of my select I already
wrote a script that actually does this, but the system is not dynamic yet.
<script type="text/javascript">
$(document).ready(function(){
$("#noOfSegments").change(function(){
var counter=${#noOfSegments}.val();
for(i=0; i<counter; i++){
var row =
$("<tr><td>"i"</td><td>"i"</td><td>"i"</td><td>"i"</td><td>"i"</td></tr>");
$("#segmentTable").append(row);
}
});
});
</script>
<select id="noOfSegments">
<option value="1">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
and #segmentTable is my table id but the above script gives me "Uncaught
SyntaxError: Unexpected token { " error Can anyone please suggest me a
solution