diff --git a/static/js/directives/buddypictureupload.js b/static/js/directives/buddypictureupload.js
index a5a21b99..fdd18d0a 100644
--- a/static/js/directives/buddypictureupload.js
+++ b/static/js/directives/buddypictureupload.js
@@ -259,20 +259,20 @@ define(['jquery', 'underscore', 'text!partials/buddypictureupload.html'], functi
 				}
 			};
 
-			$element.find("#arrow-up").on('mousedown', null, {intervalNum: intervalNum, action: moveImageUp}, changeImage);
-			$element.find("#arrow-down").on('mousedown', null, {intervalNum: intervalNum, action: moveImageDown}, changeImage);
-			$element.find("#arrow-up").on('mouseup', null, {intervalNum: intervalNum}, changeImage);
-			$element.find("#arrow-down").on('mouseup', null, {intervalNum: intervalNum}, changeImage);
+			$element.find(".fa-long-arrow-up").on('mousedown', null, {intervalNum: intervalNum, action: moveImageUp}, changeImage);
+			$element.find(".fa-long-arrow-down").on('mousedown', null, {intervalNum: intervalNum, action: moveImageDown}, changeImage);
+			$element.find(".fa-long-arrow-up").on('mouseup', null, {intervalNum: intervalNum}, changeImage);
+			$element.find(".fa-long-arrow-down").on('mouseup', null, {intervalNum: intervalNum}, changeImage);
 
-			$element.find("#arrow-left").on('mousedown', null, {intervalNum: intervalNum, action: moveImageLeft}, changeImage);
-			$element.find("#arrow-right").on('mousedown', null, {intervalNum: intervalNum, action: moveImageRight}, changeImage);
-			$element.find("#arrow-left").on('mouseup', null, {intervalNum: intervalNum}, changeImage);
-			$element.find("#arrow-right").on('mouseup', null, {intervalNum: intervalNum}, changeImage);
+			$element.find(".fa-long-arrow-left").on('mousedown', null, {intervalNum: intervalNum, action: moveImageLeft}, changeImage);
+			$element.find(".fa-long-arrow-right").on('mousedown', null, {intervalNum: intervalNum, action: moveImageRight}, changeImage);
+			$element.find(".fa-long-arrow-left").on('mouseup', null, {intervalNum: intervalNum}, changeImage);
+			$element.find(".fa-long-arrow-right").on('mouseup', null, {intervalNum: intervalNum}, changeImage);
 
-			$element.find("#larger").on('mousedown', null, {intervalNum: intervalNum, action: makeImageLarger}, changeImage);
-			$element.find("#smaller").on('mousedown', null, {intervalNum: intervalNum, action: makeImageSmaller}, changeImage);
-			$element.find("#larger").on('mouseup', null, {intervalNum: intervalNum}, changeImage);
-			$element.find("#smaller").on('mouseup', null, {intervalNum: intervalNum}, changeImage);
+			$element.find(".fa-plus").on('mousedown', null, {intervalNum: intervalNum, action: makeImageLarger}, changeImage);
+			$element.find(".fa-minus").on('mousedown', null, {intervalNum: intervalNum, action: makeImageSmaller}, changeImage);
+			$element.find(".fa-plus").on('mouseup', null, {intervalNum: intervalNum}, changeImage);
+			$element.find(".fa-minus").on('mouseup', null, {intervalNum: intervalNum}, changeImage);
 
 		};
 
diff --git a/static/partials/buddypictureupload.html b/static/partials/buddypictureupload.html
index 59342ef9..97a750a5 100644
--- a/static/partials/buddypictureupload.html
+++ b/static/partials/buddypictureupload.html
@@ -6,16 +6,16 @@
 		</span>
 		<div class="imageUtilites">
 			<div class="moveHorizontal">
-				<i id="arrow-left" class="fa fa-long-arrow-left"></i>
-				<i id="arrow-right" class="fa fa-long-arrow-right"></i>
+				<i class="fa fa-long-arrow-left"></i>
+				<i class="fa fa-long-arrow-right"></i>
 			</div>
 			<div class="moveVertical">
-				<i id="arrow-up" class="fa fa-long-arrow-up"></i>
-				<i id="arrow-down" class="fa fa-long-arrow-down"></i>
+				<i class="fa fa-long-arrow-up"></i>
+				<i class="fa fa-long-arrow-down"></i>
 			</div>
 			<div class="resize">
-				<i id="larger" class="fa fa-plus"></i>
-				<i id="smaller" class="fa fa-minus"></i>
+				<i class="fa fa-plus"></i>
+				<i class="fa fa-minus"></i>
 			</div>
 		</div>
 		<img class="preview" ng-class="{previewUpload: previewUpload}" />