Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<!-- Include Required Prerequisites -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<script type="text/javascript" src="http://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://cdn.jsdelivr.net/bootstrap/3/css/bootstrap.css" />
 
<!-- Include Date Range Picker -->
<script type="text/javascript" src="http://cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.js"></script>
<link rel="stylesheet" type="text/css" href="http://cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.css" />
<meta charset=utf-8 />
<title>JSBin Demo by Deejay</title>
</head>
<body>
  
  <button id="doit">CLICK TO CLONE</button> 
    <input type="text" class="input-group input-append date" id="fromdatePicker1" value="01/01/2015 - 01/31/2015" />
</body>
</html>
 
 jQuery(function($) {
  $('.date').daterangepicker();
  
  $('#doit').click(function(){      
    var $div = $('input[id^="fromdatePicker"]:last');
    var num = parseInt( $div.prop("id").match(/\d+/g), 10 ) +1;
    var fromdatePicker = $div.clone().prop('id', 'fromdatePicker'+num );
    $div.after( fromdatePicker.attr( 'id', 'fromdatePicker'+num) );
    $('.date').daterangepicker();
  });
  
  
  
});
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers