javascript - Why is jquery concatenating string twice? -

javascript - Why is jquery concatenating string twice? -

i'm trying play embedded youtube video after button click (.playbutton).

the video embedded iframe within div named #youtubecontainer.

the easiest way accomplish append '?autoplay=1' iframe's src attribute. (i know there api, need way.)

my html code this

<div class="playbutton"> <img class="playicon"> </div> <div id="youtubecontainer"> <iframe width="560" height="315" src="//www.youtube.com/embed/xeoflxn5520" frameborder="0" allowfullscreen></iframe> </div>

javascript code

$(function() { //this controls youtube playback via button $('.playbutton').click(function() { $("#youtubecontainer iframe").attr('src', ($("#youtubecontainer iframe").attr('src') + '?autoplay=1')); }); });

however, appends'?autoplay=1' src twice, reads follows , fails:

<iframe width="560" height="315" src="//www.youtube.com/embed/xeoflxn5520?autoplay=1?autoplay=1" frameborder="0" allowfullscreen=""></iframe>

any ideas why?

try replace autoplay before add together it. because when sec click on it, adding 1 time again ?autoplay=1 has still there before.

working demo

$("#youtubecontainer iframe").attr('src', $("#youtubecontainer iframe").attr('src').replace(/\?autoplay=1/, "") + '?autoplay=1');

javascript jquery html iframe