change value of input field onclick

Question

I am trying to change the value of an input value with the innerHtml of the button that is clicked ... I have tried a couple of ways but none have worked

<script>
   function changeValue(){
     var cValue = document.getElementbyId('technician').innerHTML;
     var cType = document.getElementbyId('type');
     var cType.value = cValue;
    }
</script>

<button id="technician" onclick="changeValue()">Technician</button>
<input type="" id="type" name="type" value="change"></input>

I also tried

<script>
   function changeValue(){
     var cValue = document.getElementbyId('technician').innerhtml;
     document.getElementbyId('type').value = ('cValue');
    }
</script>

neither seems to be working

Answer 1

you have several typos in your code uppercase and lowercase letters do matter in things like getElementById and innerHTML

i believe this is what you're trying to do:

<script>
   function changeValue(o){
     document.getElementById('type').value=o.innerHTML;
    }
</script>

<button id="technician" onclick="changeValue(this)">Technician</button>
<button id="developer" onclick="changeValue(this)">Developer</button>
<input type="text" id="type" name="type" value="change" />

Answer 2

Here's a REALLY simple way to do it:

function changeValue(value) {
  document.getElementById('button1').innerHTML = value;
}

<button onclick="changeValue('This content has changed.')" id="button1">I have some content that will change when you click on me.</button>

I hope that this example helps!