jQuery Dialog box with different color buttons

jQuery, CSS and HTML
<!doctype html>
<html>
<head>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">

  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>

<style>
.ui-dialog {
	top: 0;
	left: 0;
	padding: .2em;
    border:1px;
    
}
.ui-dialog .ui-dialog-titlebar {
    border:1px;
    display: none;
}
.ui-dialog .ui-dialog-content {
	border: 0;
	padding: 20px;
    font-size:18px;
    color:#CAAD75;
    background-color: #FDF8E4;
	overflow: auto;
}
.ui-dialog .ui-dialog-buttonpane {
	text-align: left;
	border-width: 1px 0 0 0;
	background-image: none;
	margin-top: .5em;
	padding: .3em 1em .5em .4em;
    background-color: #E3F1CF;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
	float: right;
    
}
.ui-dialog .ui-dialog-buttonpane button {
	margin: .5em .4em .5em 0;
	cursor: pointer;
    
}
.ui-dialog .ui-resizable-se {
	width: 12px;
	height: 12px;
	right: -5px;
	bottom: -5px;
	background-position: 16px 16px;
    
}
.ui-draggable-handle {
	-ms-touch-action: none;
	touch-action: none;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset .yescls
{
    font-size:15px;
    color: #FFFFFF;
    width: 150px;
    background: #90C93E;
    
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset .cancelcls
{
    font-size:15px;
    color: #FFFFFF;
    width: 150px;
    background: #F86379;
    
}

</style>
  
  <script>
  $(function() {
    $( "#j_dialog" ).dialog({
      
      autoOpen: true,
      width: 350,
      height: 300,

buttons: [
    {
        text: 'Yes, proceed!',
        open: function() { $(this).addClass('yescls') },
        click: function() { alert('OK Clicked')}
    },
    {
        text: "Cancel",
        open: function() { $(this).addClass('cancelcls') },
        click: function() { alert('Cancel Clicked')}
    }
  ],

      
      show: {
        effect: "highlight",
        duration: 1500
      },
      hide: {
        effect: "fade",
        duration: 1000
      }
    });
   });

  $( ".selector" ).dialog({
  closeOnEscape: false
});
  </script>


</head>
<body>
 
<div id="j_dialog" title="">
  <p>Are you sure you want to proceed to example.com?</p>
</div>

<div>Some text! Some text!Some text!Some text!Some text!Some text!</div> 
 
</body>
</html>
Are you sure you want to proceed to example.com?
Some text! Some text!Some text!Some text!Some text!Some text!