动态网格CSS，使用Jquery网格列和网格行更改大小（跨度）

Question

我正在尝试构建动态网格，并且当用户单击“箭头”时，我需要更改“内部”元素的大小。 这是我的网格：

$(".SizeRight").click(function(){
    console.log("i am Here !");
    $(this).parent().css( "grid-column","3 / 4");
  });

没关系，当我单击向右箭头但未进行任何修改时，控制台上会显示（“ i am Here”）。

<div class="boutique">
    <img class="Trash" src="img/Trash.png"/>
    <img class="SizeRight" src="img/SizeRight.png"/>
    <img class="SizeBottom" src="img/SizeBottom.png"/>
</div>

如果我替换

$(this).parent().css( "grid-column","3 / 4");

作者

$(this).parent().css( "background-color", "green" );

粉红色变成绿色。

这是我的精品div的CSS：

.boutique {
background: rgb(230, 91, 114) url('../img/Add.png') no-repeat center;
min-width: 75px;
min-height: 75px;

}

你有个主意吗？

感谢您的帮助：）