javascript - Is it safe to wrap a function inside jQuery.removeClass()? -

i'm working on custom slider has dynamic video. each time slide changes, new video inserted dom while previous 1 gets deleted. i'm using css transition class change video's position view, ideally want function to:

1) add css class old video

2) remove() or detach() old video**

3) add css class new video

the code have far is

function videodetach() {      // restore loading spinner     $('.spinnermsg').removeclass("nospin");      // move video out of screen , bring next 1 in     $('#bgin video:first').removeclass( function (){         $('#bgin video:first').addclass("outview");         settimeout(function(){              $('#bgin video:first').detach();             $('#bgin video:last').addclass("inview");         },250);     }); } 

this code works expected not sure if it's safe or correct, best practice accomplishing such task?

** not sure 1 choose, each video inserted slider repeats detach() seems appealing, ok store multiple videos in dom have same id? remove(); force users redownload entire video?

all feedback appreciated.

---

update

tweaked code following t.j's answer bit unstable either detaching videos or allowing duplicates, final code looks this:

function videodetach() {      // restore loading spinner     $('.spinnermsg').removeclass("nospin");      // move current video out of screen     $('#bgin video').addclass("outview");      settimeout(function(){          $('#bgin video.outview').detach(); // detach old video         $('#bgin video').addclass("inview"); // bring new video view     },250); } 

the removeclass call you're passing function no-op, remove entirely without changing happens:

function videodetach() {      // restore loading spinner     $('.spinnermsg').removeclass("nospin");      // move video out of screen , bring next 1 in     $('#bgin video:first').addclass("outview");     settimeout(function(){          $('#bgin video:first').detach();         $('#bgin video:last').addclass("inview");     },250); } 

if give function removeclass (or of jquery's other setter operations), jquery call function once each dom element in set; expects function return useful. in case of removeclass, expects function return class remove element.

the reason it's working jquery either call function once (if there's element matching #bgin video:first) or not @ all, , happens code in function if there element matching #bgin video:first. if you'd done removeclass on jquery set containing multiple elements, have called function repeatedly; if you'd called on set no elements in @ all, function never have been called. if code inside operated on different elements ones selected removeclass, result might have seemed chaotic.

what best practice accomplishing such task?

just running code directly, above, not using side-effects of operations incorrectly.

not sure 1 choose, each video inserted slider repeats detach() seems appealing, ok store multiple videos in dom have same id?

if elements detached, aren't in dom; it's fine have element exists, not in dom, has same id element in dom. based on code, wouldn't, because you're detaching video element (which doesn't have id far code demonstrates), not #bgin element.

also remove(); force users redownload entire video?

no, browser's cache not element-specific.