JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/css/bootstrap-combined.min.css">
<select name='dissertation_services' data-toggle="select"  class="btn" href="#" id="selectList" class="form-control select select-default mrs mbm">
        <option value="0">My Profile</option>
        <option value="1" data-placement="left" id="popoverOption" class="btn" href="#"  rel="popover" data-placement="bottom" data-content="Popup withfsaf option trigger"  data-original-title="Title">My Friends</option>
        <option value="2" data-content="Popufasdffasfasp withfsaf option trigger">My Profile</option>
        <option value="3">My Friends</option>
 </select>
 
 
 <div id="content">&nbsp;</div>
<select name="s1" id="s1">
  <option>op1</option>
  <option>op2</option>
  <option selected="selected">op3</option>
  <option>op4</option>
</select>

JavaScript

$('#selectList').change(function(){
    var strin = $(this).find(':selected').data('content');
   $(this).popover({html:true,placement:'left',content: strin})
   .click(function(e) { 
       e.preventDefault(); 
       $(this).focus(); 
   });
   });