Javascript Jquery-隐藏单选按钮-但使图像可单击以显示更大的图像

我当前的HTML看起来是这样的（我不能像SAAS一样控制HTML，所以我只能添加Jquery）

我想做的是类似下图的事情。问题是如何
（1）从显示器中隐藏隐藏按钮（但它应该在后台，这意味着我需要知道表单中选择了什么图像）
（2）如何将图像名称传递到

并更改该图像的源。

这是HTML文件

<div class="col-sm-8">
              <div id="input-option257">               
              <div class="radio">
                  <label>
                    <input type="radio" name="option[257]" value="133">
                     <img src="black-50x50.JPG" alt="Black " class="img-thumbnail">                   
                    Black
                     </label>
                </div>
                                <div class="radio">
                  <label>
                    <input type="radio" name="option[257]" value="141">
                     <img src="white-50x50.jpg" alt="White " class="img-thumbnail">                   
                    White
                     </label>
                </div>
                                <div class="radio">
                  <label>
                    <input type="radio" name="option[257]" value="136">
                     <img src="light%20grey-50x50.JPG" alt="Light Gray " class="img-thumbnail">                   
                    Light Gray
                     </label>
                </div>

                 </div>
            </div>

            <div class="Show-which-image-is-selected-here">
            <img src="<BIGIMAGE-black-50x50.JPG" alt="Black " class="img-thumbnail">        
            </div>

---

对于第1点：您可以只使用CSS，也可以在jQuery中使用CSS

对于点2，只需更改

input[type='radio']{
显示：无；
}

黑色
白色
浅灰色

$('#input-option257').parent().hide();