Function accepts numbers but not strings from grid cell

The problem was with .Model. This works:

@(Html.Kendo().Grid<AbilityGenerator.ViewModels.AbilityCollection>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(c => c.AbilityId).Hidden();
columns.Template(@<text>@item.AbilityName</text>).ClientTemplate("<span style='font-size:30px;horizontal-align:middle'>#: AbilityName #</span>").Width(50).Title("Ability");
columns.Template(@<text>@item.BaseScore</text>).ClientTemplate("<div style='float:left;margin-Top:10px;margin-right:20px;width:40px;text-align:center'><span style='font-size:30px;margin-top:20px'>#: BaseScore #</span></div><div style='float:left;width:20px'><img width='20' class='Up' alt='Up' src='/Images/UpArrow.png'><img width='20' class='Down' alt='Down' src='/Images/DownArrow.png'></div>").Width(20).Title("Base Score");
columns.Template(@<text>@item.TotalScore</text>).ClientTemplate("<span style='font-size:30px;horizontal-align:middle'>#: TotalScore #</span>").Width(50).Title("Total Score");
columns.Template(@<text>@item.AbilityModifierBonus</text>).ClientTemplate("<span style='font-size:30px;horizontal-align:middle'>#: AbilityModifierBonus #</span>").Width(50).Title("Ability Bonus").Width(30);
})
.DataSource(dataSource => dataSource
.Ajax()
.Events(events => events.Error("error_handler"))
.Read(read => read.Action("GetAbilityScores", "Home"))
.Update(update => update.Action("SaveAbilityScores", "Home"))
)
)

<script>

$("#grid").on("click", ".Up", function (e) {
var grid = $("#grid").data("kendoGrid");
var model = grid.dataItem($(this).closest("tr"));
var baseScore = model.BaseScore;
if(baseScore < 45)
baseScore += 1;
model.set("BaseScore", baseScore);
});

$("#grid").on("click", ".Down", function (e) {
var grid = $("#grid").data("kendoGrid");
var model = grid.dataItem($(this).closest("tr"));
var baseScore = model.BaseScore;
if (baseScore > 1)
baseScore -= 1;
model.set("BaseScore", baseScore);
});

</script>