Edit in JSFiddle

// helper functions
sendDtmf = function(dtmf) {  
    if (typeof call === undefined)
        alert('call is not established');
    else
        call.sendDTMF(dtmf);     
}

// call controls
var remoteView =  document.getElementById('remoteView');

var terminateButton = document.getElementById('terminateButton');
terminateButton.addEventListener("click", function () {
  call.terminate();
}, false);

// minimal user agent 
var ua = new JsSIP.UA({
    'ws_servers': 'wss://tryit.areteasea.com:8081',
    'uri': 'sip:[email protected]',
    'register': false
});

ua.start();


// call event callbacks
var eventHandlers = {
  'failed':     function(e){ alert(e.cause); },
  'addstream': function(e){
      // attach remote streams to remoteView.
      remoteStream = e.stream;
      remoteView = JsSIP.rtcninja.attachMediaStream(remoteView, remoteStream);
   }
};

call = ua.call('[email protected]', {
    'eventHandlers': eventHandlers
});

<video id="remoteView" autoplay _hidden=true></video>

<br>
<button onclick="sendDtmf(1)">1</button>
<button onclick="sendDtmf(3)">2</button>
<button onclick="sendDtmf(3)">3</button>
<br>
<button onclick="sendDtmf(4)">4</button>
<button onclick="sendDtmf(5)">5</button>
<button onclick="sendDtmf(6)">6</button>
<br>
<button onclick="sendDtmf(7)">7</button>
<button onclick="sendDtmf(8)">8</button>
<button onclick="sendDtmf(9)">9</button>
<br>
<button onclick="sendDtmf('*')">*</button>
<button onclick="sendDtmf(0)">0</button>
<button onclick="sendDtmf('#')">#</button>
<br>

<button id="terminateButton" type="button">End Call</button>

<!-- Open the browser's JavaScript console to see the logs  -->
<script>JsSIP.debug.enable("*");</script>

<!-- jssip.js is included by JsFiddle as External Resources -->

video {
    border: 1px solid lightgrey;
    width: 300px;
    height: 220px;
}