帶有複選框的Textarea佔位符

Question

我試圖通過按複選框按鈕來更改textarea的佔位符。我無法讓它改變。

要清楚，我試圖設置佔位符不是一個值。

我的textarea：

<textarea name="problem" id="problem" rows="3" class="form-control" cols="45" placeholder="Describe your ticket reason in as few words as possible."></textarea> 

我的javascript：

<div class="onoffswitch"> 
       <input type="checkbox" onchange="changeplh()" name="onoffswitch" class="onoffswitch-checkbox" value="1" id="myonoffswitch" checked> 
        <label class="onoffswitch-label" for="myonoffswitch"> 
         <span class="onoffswitch-inner"></span> 
         <span class="onoffswitch-switch"></span> 
        </label> 

       <script> 
        function changeplh(){ 
         debugger; 
         var sel = document.getElementById("myonoffswitch"); 
         var textbx = document.getElementById("problem"); 
         var indexe = sel.selectedIndex; 

         if(indexe == 0) { 
          $("#problem").val(''); 
          $("#problem").prop("placeholder", "age"); 

        } 
          if(indexe == 1) { 
          $("#problem").val(''); 
          $("#problem").prop("placeholder", "name"); 
        } 
        }   
       </script> 
      </div> 

我特別需要 - 複選框按鈕，改變一個textarea的2個不同的選項的佔位符。 EX：點擊它一次，它說「年齡」，再次點擊它說「名稱」，再次點擊它說「年齡」等。