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:test@areteasea.com',
    '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('music@frafos.com', {
    '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;
}